在J2EE應(yīng)用中安裝及設(shè)置FCKeditor
?? 在J2EE應(yīng)用中,大量用到在web頁(yè)面上使用文本編輯器的地方,以前一直苦于找不到比較好的文本編輯器,要么是速度太慢,要么是功能不強(qiáng),或者跟程序配合上問(wèn)題較大。這兩天發(fā)現(xiàn)了FCKeditor,試用了一下,覺(jué)得非常好,與J2EE程序的配合也非常方便。下面是應(yīng)用的截圖:?
?
????? 基本上我們需要的編輯功能它都能夠?qū)崿F(xiàn),包括粘貼word格式的文檔,上傳圖片,設(shè)置圖片與文字的各種格式,預(yù)覽,最重要是它不但完全免費(fèi),而且是多國(guó)語(yǔ)言的,對(duì)中文的支持也非常好。
下面我簡(jiǎn)單介紹一下如何在J2EE應(yīng)用中使用FCKeditor。
1、下載
????? 在http://www.fckeditor.net/download/default.html下載FCKeditor的最新版本2.0RC,由于我們使用的是Java,還要在
下面我簡(jiǎn)單介紹一下如何在J2EE應(yīng)用中使用FCKeditor。
1、下載
????? 在http://www.fckeditor.net/download/default.html下載FCKeditor的最新版本2.0RC,由于我們使用的是Java,還要在
這個(gè)地址下載FCKeditor for java的工具包,這里面提供了標(biāo)簽庫(kù)和圖片上傳的jar。
2、安裝
???? 下載完成后,在J2EE應(yīng)用中,假設(shè)為fcktest,建立文件夾FCKeditor,將FCKeditor_2.0中的editor目錄及fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml等文件拷貝到FCKeditor目錄下。
2、安裝
???? 下載完成后,在J2EE應(yīng)用中,假設(shè)為fcktest,建立文件夾FCKeditor,將FCKeditor_2.0中的editor目錄及fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml等文件拷貝到FCKeditor目錄下。
?
???? 然后我們將FCKeditor-2.3\web\WEB-INF\lib中的兩個(gè)jar包拷貝到\fcktest\WEB-INF\lib目錄下,將FCKeditor-2.3\src下的FCKeditor.tld拷貝到\fcktest\WEB-INF下。
???? 編輯\fcktest\WEB-INF\web.xml文件,將FCKeditor-2.3\web\WEB-INF\web.xml里的內(nèi)容復(fù)制過(guò)來(lái),修改<servlet-mapping>里的內(nèi)容為:
?<servlet-mapping>
??? <servlet-name>Connector</servlet-name>
??? <url-
?<servlet-mapping>
??? <servlet-name>Connector</servlet-name>
??? <url-
pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-
pattern>
? </servlet-mapping>
?
? <servlet-mapping>
??? <servlet-name>SimpleUploader</servlet-name>
??? <url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
? </servlet-mapping>
? </servlet-mapping>
?
? <servlet-mapping>
??? <servlet-name>SimpleUploader</servlet-name>
??? <url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
? </servlet-mapping>
???并且添加以下內(nèi)容:
? <taglib>
??<taglib-uri>/FCKeditor</taglib-uri>
??<taglib-location>/WEB-INF/FCKeditor.tld</taglib-location>
? </taglib>
3、使用
????? 假設(shè)我們?cè)诟夸浵陆⒘薸ndex.jsp頁(yè)面,在該頁(yè)面中希望使用文本編輯工具,可以參考下面的頁(yè)面代碼:
<%@ page contentType="text/html;charset=GBK"%>
<%@ taglib uri="/FCKeditor" prefix="FCK" %>
<html>
?<head>
??<title>Welcome</title>
??
?</head>
?<body>
?<form name="form1" action='success.jsp' method="post">
??<FCK:editor id="EditorAccessibility"
????? width="80%" height="320"
????? fontNames="宋體;黑體;隸書;楷體_GB2312;Arial;Comic Sans MS;Courier
?<head>
??<title>Welcome</title>
??
?</head>
?<body>
?<form name="form1" action='success.jsp' method="post">
??<FCK:editor id="EditorAccessibility"
????? width="80%" height="320"
????? fontNames="宋體;黑體;隸書;楷體_GB2312;Arial;Comic Sans MS;Courier
New;Tahoma;Times New Roman;Verdana"
?????
?????
imageBrowserURL="/fkctest/FCKeditor/editor/filemanager/browser/default/browser.html?
Type=Image&Connector=connectors/jsp/connector"
???
???
linkBrowserURL="/fkctest/FCKeditor/editor/filemanager/browser/default/browser.html?
Connector=connectors/jsp/connector"
???
???
flashBrowserURL="/fkctest/FCKeditor/editor/filemanager/browser/default/browser.html?
Type=Flash&Connector=connectors/jsp/connector"
???
???
imageUploadURL="/fkctest/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Image"
???
???
linkUploadURL="/fkctest/FCKeditor/editor/filemanager/upload/simpleuploader?Type=File"
???
???
flashUploadURL="/fkctest/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Flash">
???
??</FCK:editor>
??
??<input type="submit" name="SubM" value="發(fā)表" />
?</form>
?</body>
</html>
???
??</FCK:editor>
??
??<input type="submit" name="SubM" value="發(fā)表" />
?</form>
?</body>
</html>
???? 在該頁(yè)面中,我們使用了FCKeditor提供的標(biāo)簽,具體屬性我就不詳細(xì)介紹了,估計(jì)大家一看就明白了。
4、內(nèi)容傳遞
????? 那么,我們?nèi)绾问褂肍CKeditor中的內(nèi)容呢,按照我們一般的做法,是將form提交到下一個(gè)頁(yè)面進(jìn)行處理,在該頁(yè)面中得到編輯器中的內(nèi)容,然后存入數(shù)據(jù)庫(kù)等等。有兩種方法,可以實(shí)現(xiàn)。
???? 第一,設(shè)置submit按鈕,提交后,使用request.getParameter("EditorAccessibility"),即可得到相應(yīng)的內(nèi)容。
???? 第二,直接點(diǎn)擊保存按鈕,即可實(shí)現(xiàn)提交。
5、相關(guān)設(shè)置
??? 圖片快速上傳,需要修改web.xml文件中的
<init-param>
???<param-name>enabled</param-name>
???<param-value>false</param-value>
??</init-param>
????? 將其中false改為true,即可實(shí)現(xiàn)快速上傳。
???? 不需要服務(wù)器啟動(dòng)時(shí)顯示相關(guān)信息,可修改web.xml文件中的
<init-param>
???<param-name>debug</param-name>
???<param-value>true</param-value>
??</init-param>
???? 將其中的true改為false即可。
???? 清楚不需要的文件,editor目錄下_source文件夾可以刪除,editor\filemanager\browser\default\connectors下除jsp相關(guān)的文件外也可刪除,
<init-param>
???<param-name>enabled</param-name>
???<param-value>false</param-value>
??</init-param>
????? 將其中false改為true,即可實(shí)現(xiàn)快速上傳。
???? 不需要服務(wù)器啟動(dòng)時(shí)顯示相關(guān)信息,可修改web.xml文件中的
<init-param>
???<param-name>debug</param-name>
???<param-value>true</param-value>
??</init-param>
???? 將其中的true改為false即可。
???? 清楚不需要的文件,editor目錄下_source文件夾可以刪除,editor\filemanager\browser\default\connectors下除jsp相關(guān)的文件外也可刪除,
editor\filemanager\upload除jsp相關(guān)的文件外也可刪除,editor\lang下的語(yǔ)言文件,保留英文和中文
及fcklanguagemanager.js即可,其他的一律可以刪除。
posted on 2006-11-24 18:03 GuanHui 閱讀(540) 評(píng)論(2) 編輯 收藏