HTML编辑器FCKeditor使用详解
http://www.diybl.com/ 2008-7-7 网络 点击:
[ 评论 ]
文章搜索：
【点击打包该文章】
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Connector=/fckeditor/connector'' ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Type=Image&Connector=/fckeditor/connector'' ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Type=Flash&Connector=/fckeditor/connector'' ;
FCKConfig.LinkUploadURL = ''/fckeditor/simpleuploader?Type=File'' ;
FCKConfig.ImageUploadURL = ''/fckeditor/simpleuploader?Type=Image'' ;
FCKConfig.FlashUploadURL = ''/fckeditor/simpleuploader?Type=Flash'';
<%@ page contentType="text/html;charset=GBK"%>
<html>
<head>
<title>FCKeditor Test</title>
<script type="text/javascript" src="/fckeditor/fckeditor.js"></script>
</head>
<body>
<form action="fckdemo.jsp" method="post">
<% String content=request.getParameter("content");%>
<table width=100%>
<tr>
<td colspan=4 style=''text-align:center'' width=100% height=50px>
<span>
<script type="text/javascript">
var oFCKeditor = new FCKeditor(''content'');//表单的name，取值的依据
oFCKeditor.BasePath=''/fckeditor/'';//指定FCKeditor根路径，也就是fckeditor.js所在的路径
oFCKeditor.Height=''100%'';
oFCKeditor.ToolbarSet=''Demo'';//指定工具栏
oFCKeditor.Value="<%=content==null?"":(content.replaceAll("\"", "''"))%>";//默认值
oFCKeditor.Create();
</script>
</span>
</td>
</tr>
<tr><td align=center><input type="submit" value="提交"></td></tr>
<tr><td> </td></tr>
<tr><td>取值（可直接保存至数据库）：</td></tr>
<tr><td style="padding:10px;"><%=content%></td></tr>
</table>
</form>
</body>
</html>
4、修改/WebRoot/fckeditor/fckconfig.js，修改部分如下：
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Connector=/fckeditor/connector'' ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Type=Image&Connector=/fckeditor/connector'' ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + ''filemanager/browser/default/browser.html?Type=Flash&Connector=/fckeditor/connector'' ;
FCKConfig.LinkUploadURL = ''/fckeditor/simpleuploader?Type=File'' ;
FCKConfig.ImageUploadURL = ''/fckeditor/simpleuploader?Type=Image'' ;
FCKConfig.FlashUploadURL = ''/fckeditor/simpleuploader?Type=Flash'';
注意：步骤3、4设置了文件浏览和上传的配置，web.xml中Servlet的<url-pattern>要和fckconfig.js中的URL引用一致
四、使用
本例使用最直接的js方式，API和TagLib方式参见FCKeditor-2.3.zip解压后_samples下的例子。
fckdemo.jsp:
<%@ page contentType="text/html;charset=GBK"%>
<html>
<head>
<title>FCKeditor Test</title>
<script type="text/javascript" src="/fckeditor/fckeditor.js"></script>
</head>
<body>
<form action="fckdemo.jsp" method="post">
<% String content=request.getParameter("content");%>
<table width=100%>
<tr>
<td colspan=4 style=''text-align:center'' width=100% height=50px>
<span>
<script type="text/javascript">
var oFCKeditor = new FCKeditor(''content'');//表单的name，取值的依据
oFCKeditor.BasePath=''/fckeditor/'';//指定FCKeditor根路径，也就是fckeditor.js所在的路径
oFCKeditor.Height=''100%'';
oFCKeditor.ToolbarSet=''Demo'';//指定工具栏
oFCKeditor.Value="<%=content==null?"":(content.replaceAll("\"", "''"))%>";//默认值
oFCKeditor.Create();
</script>
</span>
</td>
</tr>
<tr><td align=center><input type="submit" value="提交"></td></tr>
<tr><td> </td></tr>
<tr><td>取值（可直接保存至数据库）：</td></tr>
<tr><td style="padding:10px;"><%=content%></td></tr>
</table>
</form>
</body>
</html>
效果图：
如果图片或页面不能正常显示请点击这里 站内搜索：
推荐文章 |