1.FCKeditor 介紹
FCKeditor 這個開源的HTML 文本編輯器可以讓web 程序擁有如MS Word 這樣強大的編輯功能,.FCKeditor 支持當前流行的瀏覽器。
2.準備工作:
環境:winddows XP、tomcat6.0、JDK1.6
下載:
1):FCKeditor_2.6.4.zip
地址:http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor_2.6.4.zip
2):fckeditor-java-2.4.1-bin.zip (JAVA支持包)地址http://nchc.dl.sourceforge.net/sourceforge/fckeditor/fckeditor-java-2.4.1-bin.zip
3):slf4j-1.5.2.zip 地址 :http://www.slf4j.org/dist/slf4j-1.5.2.zip
3.安裝:
下面以jsp為例:
分別解壓之后,我們可以得到一個fckeditor和fckeditor-java-2.4.1兩個文件夾。fckeditor文件夾下是需要調用的頁面和js文件等等,有各種版本,無所謂啦,我們之需要jsp就夠了。將文件加全部復制到工程目錄下等待調用即可。
注意:有點麻煩的是導包的問題。我們一共需要5個包:commons-fileupload-1.2.1.jar,commons-io-1.3.2.jar,fckeditor-java-core-2.4.1.jar,slf4j-api-1.5.6.jar,slf4j-simple-1.5.6.jar或slf4j-jdk14-1.5.6.jar。
上面前四個包都可以在fckeditor-java-2.4.1文件夾下面找到,但是第五個卻要另外去找,這點我非常不理解,為什么不放在一起。
如果沒有的話編譯時就會出現如下錯誤信息:
嚴重: Servlet /fckeditorDemo threw load() exception
java.lang.NoClassDefFoundError: org/slf4j/impl/StaticLoggerBinder
當然版本或許不同,以上的版本是截止2009-02-4的最新版本。如果想要最新版本,可以在slf4j的官網http://www.slf4j.org/download.html下到。但是要注意,截止到2009-2-4,slf4j官方最新版本是1.5.6,但是fckeditor提供的slf4j-api卻是1.5.2版本,如果兩個版本不一樣的話,你將會在控制臺看到如下的消息:
嚴重: Servlet /Java threw load() exception
java.lang.IllegalAccessError: tried to access field org.slf4j.impl.StaticLoggerBinder.SINGLETON from class
org.slf4j.LoggerFactory
所以千萬要注意版本一致問題。如果你實在覺得下載很麻煩,那就到這里下載吧:http://www.slf4j.org/download.html
4.配置
1)在工程目錄src/下新建一個文件fckeditor.properties,添加內容:
connector.userFilesPath=UploadFile
connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl
其中第一行為重新定義上傳的文件夾,默認文件夾為userfile,保存即可。
2)修改web.xml,用來提供上傳功能支持
<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>
net.fckeditor.connector.ConnectorServlet
</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>
/fckeditor/editor/filemanager/connectors/*
</url-pattern>
</servlet-mapping>
5.應用,建立一JSP文件如下
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String content=request.getParameter("edt1");
if (content != null) {
content = content.replaceAll("\r\n", "");
content = content.replaceAll("\r", "");
content = content.replaceAll("\n", "");
content = content.replaceAll("\"", "'");
}else{
content = "";
}
//下面是處理中文內容的編碼轉換
content = new String(content.getBytes("iso8859-1"),"utf-8");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>FCKEditor 測試</title>
</head>
<script type="text/javascript" src="fckeditor/fckeditor.js"></script>
<body>
This is my JSP page. <br>
<form method="post" name="frm1">
<script type="text/javascript">
var oFCKeditor = new FCKeditor("edt1");
oFCKeditor.BasePath = "fckeditor/";
oFCKeditor.Height='400';
oFCKeditor.Value="<%=content%>";
oFCKeditor.Create();
</script>
<input type="submit" value="提交">
</form>
<hr>
<%=content%>
</body>
</html>
啟動服務器,用瀏覽器訪問即可看到結果
今天折騰了一個下午,終于算是看到點效果了,便記錄在這里,上面的內容在網上轉了一部分,因為找不到原文出處,也就沒有注明了