方法一:通过javascript调用编辑器的步骤
- 引入fckeditor.js文件,语句:
<script type="text/javascript" src="<%=request.getContextPath()%>/FCKPath/FCKeditor/fckeditor.js"></script>
- 创建编辑器:
<script type="text/javascript">
var contentFCKeditor = new FCKeditor('body') ; //body为与该表单对应的property
contentFCKeditor.BasePath = "<%=request.getContextPath()%>/FCKPath/FCKeditor/"; //设置FCKeditor编辑器的路径
contentFCKeditor.Width = "555";
contentFCKeditor.Height = "400";
contentFCKeditor.ToolbarSet = "Peafowl" ; //设置编辑器的工具栏集合,可在fckconfig.js文件设置
contentFCKeditor.Create(); //创建编辑器
</script>
方法二:与java集成,通过提供的标签调用编辑器的步骤
- FCKeditor-2.3.zip是将FCKeditor与java进行集成的压缩包。将FCKeditor-2.3/web/ WEB-INF/lib中的两个jar包拷贝到/fcktest/WEB-INF/lib目录下,将FCKeditor-2.3/src下的 FCKeditor.tld拷贝到/fcktest/WEB-INF下。
- 将FCKeditor-2.3/web/WEB-INF/web.xml里的内容并入项目的web.xml文件中,修改其内容如下:
<!-- ==================FCKeditor Servlet========================-->
<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>false</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/module/include/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-pattern>
</servlet-mapping>
<servlet>
<servlet-name>SimpleUploader</servlet-name>
<servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>false</param-value>
</init-param>
<init-param>
<param-name>enabled</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>AllowedExtensionsFile</param-name>
<param-value></param-value>
</init-param>
<init-param>
<param-name>DeniedExtensionsFile</param-name>
<param-value>php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi</param-value>
</init-param>
<init-param>
<param-name>AllowedExtensionsImage</param-name>
<param-value>jpg|gif|jpeg|png|bmp</param-value>
</init-param>
<init-param>
<param-name>DeniedExtensionsImage</param-name>
<param-value></param-value>
</init-param>
<init-param>
<param-name>AllowedExtensionsFlash</param-name>
<param-value>swf|fla</param-value>
</init-param>
<init-param>
<param-name>DeniedExtensionsFlash</param-name>
<param-value></param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>SimpleUploader</servlet-name>
<url-pattern>/module/include/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
</servlet-mapping> - 在web.xml文件中加入以下内容:
<taglib>
<taglib-uri>/FCKeditor</taglib-uri>
<taglib-location>/WEB-INF/tld/FCKeditor.tld</taglib-location>
</taglib> - 再需要用FCKeditor编辑器的jsp页面中引用标记:
<%@ taglib uri="/FCKeditor" prefix="FCK" %>
- 在页面中使用编辑器:
<FCK:editor id="body" //body为与该表单对应的property
basePath = "/path/FCKPath/FCKeditor/"
width="80%" //Width
height="120" //Height
toolbarSet="Peafowl"> //Toolbar name
</FCK:editor>
FCKeditor编辑器文件上传配置
FCKeditor编辑器的配置文件是fckconfig.js,其中有对编辑器各种默认属性的设置。以下是fckeditor与java集成使用 时上传文件的设置(需要注意的是编辑器不会自动创建文件上传的文件夹,需要在项目的根目录中手动添加),将fckeditor.js文件中以下几个属性原 来的值修改为如下设置:
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' ;
至此,即可使用FCKeditor的文件上传功能。