FCKeditor +jsp 配置使用

最新推荐文章于 2024-11-07 12:04:46 发布

xiao229404041

最新推荐文章于 2024-11-07 12:04:46 发布

阅读量508

点赞数

文章标签： fckeditor jsp import 测试 java border

本文链接：https://blog.csdn.net/xiao229404041/article/details/6428464

版权

本文详细介绍了如何将FCKeditor集成到JSP中，包括下载最新版本的FCKeditor，设置Tomcat虚拟目录，修改配置文件如web.xml、fckeditor.js和fckconfig.js，以及创建index.jsp和FCKeditorTest.jsp用于展示和接收编辑器内容。通过这些步骤，实现了FCKeditor在JSP中的使用和文件上传功能。

摘要由CSDN通过智能技术生成

FCKeditor是一款跨平台的在线编辑器，到我发布本文，FCKeditor的官方版本已经发展到了2.6.4
点击进入
1、首先登陆 www.fckeditor.net/download 下载FCKeditor的最新版本，需要下载2个压缩包，一个是基本应用，另一个是在为在jsp下所准备的配置。
   下载之后分别为： FCKeditor_2.6b.zip 和 FCKeditor-2.3.zip 将它们分别解压。
2、首先在Tomcat下建立一个虚拟目录例如：test    即 http://localhost:8080/test
      将解压后的FCKeditor_2.6b文件夹下的fckeditor拷贝到test目录下，并重新命名为FCKeditor。
      将解压后的FCKeditor-2.3文件夹下的web下的WEB-INF拷贝到test目录下。
       将FCKeditor-2.3文件夹下src下的FCKeditor.tld拷贝到test目录下的WEB-INF下。
3、修改WEB-INF下的web.xml
     将第37行false改为true，此处为允许上传。
改之前：
35   <init-param>
36    <param-name>enabled</param-name>
37    <param-value> false</param-value>
38   </init-param>
改之后：
37    <param-value> true</param-value>
     将第68行与73行中的fckeditor改为FCKeditor。
改之前：
66 <servlet-mapping>
67    <servlet-name>Connector</servlet-name>
68    <url-pattern>/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
69 </servlet-mapping>
70
71 <servlet-mapping>
72    <servlet-name>SimpleUploader</servlet-name>
73    <url-pattern>/editor/filemanager/upload/simpleuploader</url-pattern>
74 </servlet-mapping>
改之后：
68    <url-pattern>/ FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
73    <url-pattern>/ FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
4、修改FCKeditor文件夹下的fckeditor.js
     修改第50行的FCKeditor.BasePath。
改之后：
50 FCKeditor.BasePath = 'FCKeditor/' ;（注意：FCKeditor之前是没有/的）
5、修改FCKeditor文件夹下的fckconfig.js
     修改FCKConfig.DefaultLanguage、FCKConfig.LinkBrowserURL、FCKConfig.ImageBrowserURL、FCKConfig.FlashBrowserURL、
改之后：
FCKConfig.AutoDetectLanguage = false ;   注意：如果这里没有改为false编辑器是不会显示为中文的
FCKConfig.DefaultLanguage   = 'zh-cn' ;
FCKConfig.LinkBrowserURL = FCKConfig.BasePath + ‘filemanager/browser/default/browser.html?Connector=connectors/jsp/connector’;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + ‘filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector’;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + ‘filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector’;
FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File' ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;
6、index.jsp内容如下：
<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>
<title>FCKeditor测试</title>
<script type="text/javascript" src="FCKeditor/fckeditor.js"></script>
</head>
<body>
<form id="form1" name="form1" method="post" action="FCKeditorTest.jsp">
<table width="100%" border="0">
<tr>
    <td height="25">
      <textarea name="contest" id="contest" style="width:100%; height:400px;"></textarea>
<script type="text/javascript">
var oFCKeditor = new FCKeditor( 'contest' ) ;
//oFCKeditor.BasePath = 'FCKeditor/' ;
oFCKeditor.ToolbarSet = 'Default' ;
oFCKeditor.Width = '100%' ;
oFCKeditor.Height = '400' ;
oFCKeditor.Value = '' ;
oFCKeditor.ReplaceTextarea();
</script>
      <input type="submit" name="Submit" value="提交" />
    </td>
</tr>
</table>
</form>
</body>
</html>

7、FCKeditorTest.jsp内容如下：
<%@ page contentType="text/html; charset=GBK" language="java" import="java.sql.*" errorPage="" %>
<head>
<title>FCKeditor测试接收结果</title>
</head>
<body>
<%request.setCharacterEncoding("GBK"); %>
<% =request.getParameter("contest")%>
</body>
</html>

最后测试：http://localhost:8080/test/index.jsp
图1：