在JSP中配置FCKeditor 2.6.4

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>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章