现在已经升级成CKeditor了 不过这方面的教程不是很多，也没啥时间去弄，所以找了以前的文章学习了一下，先记录如下。?
1.下载?
FCKeditor2.3 (FCKeditot for java) 包括了相应的jar文件 源码 以及editor及配置文件?
2.建立项目:?
建立项目FCKeditor_Demo?
3.将FCKeditor2.3解压缩,将整个目录editor复制到项目的Webroot下?
? 将fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml 文件夹到项目中的 WebRoot 目录?
? 将"web\WEB-INF\lib 下的两个 jar 文件到项目的 WebRoot"WEB-INF"lib 目录?
? 将其中的 "src 下的 FCKeditor.tld 文件到项目的 WebRoot"WEB-INF 目录?
??
4.项目的web.xml修改如下(可从web目录WEB-INF中获取web.xml)?
<!-- FCKeditor配置 --> <display-name>FCKeditor</display-name> <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>true</param-value> </init-param> <load-on-startup>1</load-on-startup> </servlet> <servlet> <servlet-name>SimpleUploader</servlet-name> <servlet-class> com.fredck.FCKeditor.uploader.SimpleUploaderServlet </servlet-class> <init-param> <param-name>baseDir</param-name> <!-- 此为文件上传路径，需要在WebRoot 目录下新建 UserFiles 文件夹 --> <!-- 根据文件的类型还需要新建相关的文件夹 Image、Flash --> <param-value>/UserFiles/</param-value> </init-param> <init-param> <param-name>debug</param-name> <param-value>true</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>Connector</servlet-name> <url-pattern> /editor/filemanager/browser/default/connectors/jsp/connector </url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>SimpleUploader</servlet-name> <url-pattern> /editor/filemanager/upload/simpleuploader </url-pattern> </servlet-mapping> <!-- FCKeditor配置 -->
?(可选)删除无用的文件?
删除无用文件?
删除/FCKeditor/目录下除fckconfig.js, fckeditor.js, fckstyles.xml, fcktemplates.xml四个文件以外的所有文件?
删除目录/editor/_source,?
删除/editor/filemanager/browser/default/connectors/下的所有文件?
删除/editor/filemanager/upload/下的所有文件?
删除/editor/lang/下的除了fcklanguagemanager.js, en.js, zh.js, zh-cn.js四个文件的所有文件?
5.修改配置：?
打开/fckconfig.js?
修改 FCKConfig.DefaultLanguage = 'zh-cn' ;?
把FCKConfig.LinkBrowserURL等的值替换成以下内容：?
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.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;?
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;?
6.其它?
fckconfig.js总配置文件，可用记录本打开，修改后将文件存为utf-8 编码格式。找到：?
FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ; 即在编辑器域内可以使用Tab键。?
如果你的编辑器还用在网站前台的话，比如说用于留言本或是日记回复时，那就不得不考虑安全了，?
在前台千万不要使用Default的toolbar，要么自定义一下功能，要么就用系统已经定义好的Basic，?
也就是基本的toolbar，找到：?
FCKConfig.ToolbarSets["Basic"] = [?
['Bold','Italic','-','OrderedList','UnorderedList','-',/*'Link',*/'Unlink','-','Style','FontSize','TextColor','BGColor','-',?
'Smiley','SpecialChar','Replace','Preview'] ] ;?
这是改过的Basic，把图像功能去掉，把添加链接功能去掉，因为图像和链接和flash和图像按钮添加功能都能让前台?
页直接访问和上传文件， fckeditor还支持编辑域内的鼠标右键功能。?
FCKConfig.ContextMenu = ['Generic',/*'Link',*/'Anchor',/*'Image',*/'Flash','Select','Textarea','Checkbox','Radio','TextField','HiddenField',?
/*'ImageButton',*/'Button','BulletedList','NumberedList','TableCell','Table','Form'] ;?
这也是改过的把鼠标右键的“链接、图像，FLASH，图像按钮”功能都去掉。?
找到： FCKConfig.FontNames = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;?
加上几种我们常用的字体?
FCKConfig.FontNames?
= '宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;?
7.<%--?
三种方法调用FCKeditor?
1.FCKeditor自定义标签 (必须加头文件 <%@ taglib uri="/TestFCKeditor" prefix="FCK" %> )?
2.script脚本语言调用 (必须引用 脚本文件 <script type="text/javascript" src="/TestFCKeditor/FCKeditor/fckeditor.js"></script> )?
3.FCKeditor API 调用 (必须加头文件 <%@ page language="java" import="com.fredck.FCKeditor.*" %> )?
--%>?
//标签调用方式?
<%--?
<form action="show.jsp" method="post" target="_blank">?
<FCK:editor id="content" basePath="/FCKeditor_Demo/"?
width="700"?
height="500"?
skinPath="/FCKeditor_Demo/editor/skins/silver/"?
toolbarSet = "Default"?
>?
input?
</FCK:editor>?
<input type="submit" value="Submit">?
</form>?
--%>?
//JS调用方式?
<form action="show.jsp" method="post" target="_blank">?
<table border="0" width="700"><tr><td>?
<textarea id="content" name="content" style="WIDTH: 100%; HEIGHT: 400px">input</textarea>?
<script type="text/javascript">?
var oFCKeditor = new FCKeditor('content') ;?
oFCKeditor.BasePath = "/FCKeditor_Demo/" ;?
oFCKeditor.Height = 400;?
oFCKeditor.ToolbarSet = "Default" ;?
oFCKeditor.ReplaceTextarea();?
</script>?
<input type="submit" value="Submit">?
</td></tr></table>?
</form>?
//FCKeditor API 调用?
<%--?
<form action="show.jsp" method="post" target="_blank">?
<%?
FCKeditor oFCKeditor ;?
oFCKeditor = new FCKeditor( request, "content" ) ;?
oFCKeditor.setBasePath( "/FCKeditor_Demo/" ) ;?
oFCKeditor.setValue( "input" );?
out.println( oFCKeditor.create() ) ;?
%>?
<br>?
<input type="submit" value="Submit">?
</form>?
--%>?
只测试并成功了script方法~?
8.上传文件的时候是调用FCKeditor.jar中的Servlet 可以将src中的源码拷贝到工程中，方便功能的修改?
9.web.xml中?
?
?
<init-param> <param-name>baseDir</param-name> <!-- 此为文件浏览路径 --> <param-value>/UserFiles/</param-value> </init-param>
?
/UserFiles/为上传文件的路径，需要在WebRoot下添加此目录，并添加Image和Flash目录分别存放图片和flash；不加的话可能会出现权限不够的警告窗口?
10.以下是转载的一些备用信息，此次配置中没碰到问题，所以也没细看~留着以防不时之需吧?
配置选项:
AutoDetectLanguage=true/false 自动检测语言
BaseHref="" 相对链接的基地址
ContentLangDirection="ltr/rtl" 默认文字方向
ContextMenu=字符串数组,右键菜单的内容
CustomConfigurationsPath="" 自定义配置文件路径和名称
Debug=true/false 是否开启调试功能,这样,当调用FCKDebug.Output()时,会在调试窗中输出内容
DefaultLanguage="" 缺省语言
EditorAreaCss="" 编辑区的样式表文件
EnableSourceXHTML=true/false 为TRUE时,当由可视化界面切换到代码页时,把HTML处理成XHTML
EnableXHTML=true/false 是否允许使用XHTML取代HTML
FillEmptyBlocks=true/false 使用这个功能,可以将空的块级元素用空格来替代
FontColors="" 设置显示颜色拾取器时文字颜色列表
FontFormats="" 设置显示在文字格式列表中的命名
FontNames="" 字体列表中的字体名
FontSizes="" 字体大小中的字号列表
ForcePasteAsPlainText=true/false 强制粘贴为纯文本
ForceSimpleAmpersand=true/false 是否不把&符号转换为XML实体
FormatIndentator="" 当在源码格式下缩进代码使用的字符
FormatOutput=true/false 当输出内容时是否自动格式化代码
FormatSource=true/false 在切换到代码视图时是否自动格式化代码
FullPage=true/false 是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容
GeckoUseSPAN=true/false 是否允许SPAN标记代替B,I,U标记
IeSpellDownloadUrl=""下载拼写检查器的网址
ImageBrowser=true/false 是否允许浏览服务器功能
ImageBrowserURL="" 浏览服务器时运行的URL
ImageBrowserWindowHeight="" 图像浏览器窗口高度
ImageBrowserWindowWidth="" 图像浏览器窗口宽度
LinkBrowser=true/false 是否允许在插入链接时浏览服务器
LinkBrowserURL="" 插入链接时浏览服务器的URL
LinkBrowserWindowHeight=""链接目标浏览器窗口高度
LinkBrowserWindowWidth=""链接目标浏览器窗口宽度
Plugins=object 注册插件
PluginsPath="" 插件文件夹
ShowBorders=true/false 合并边框
SkinPath="" 皮肤文件夹位置
SmileyColumns=12 图符窗列数
SmileyImages=字符数组 图符窗中图片文件名数组
SmileyPath="" 图符文件夹路径
SmileyWindowHeight 图符窗口高度
SmileyWindowWidth 图符窗口宽度
SpellChecker="ieSpell/Spellerpages" 设置拼写检查器
StartupFocus=true/false 开启时FOCUS到编辑器
StylesXmlPath="" 设置定义CSS样式列表的XML文件的位置
TabSpaces=4 TAB键产生的空格字符数
ToolBarCanCollapse=true/false 是否允许展开/折叠工具栏
ToolbarSets=object 允许使用TOOLBAR集合
ToolbarStartExpanded=true/false 开启是TOOLBAR是否展开
UseBROnCarriageReturn=true/false 当回车时是产生BR标记还是P或者DIV标记
解决上传乱码:在SimpleUploaderServlet.java和ConnectorServlet.java两个文件里找到DiskFileUpload upload = new DiskFileUpload();
分别在其后加入 upload.setHeaderEncoding("utf-8");这样解决了文件上传的中文乱码问题.但是在控制台显示的中文内容还是乱码,但是没关系,我们没必要去看控制台下的中文
500错误：
如果你上传时，出现500的错误，试试加上serializer.jar、xalan.jar、commons-fileupload.jar三个包。
二、根据自己的需求修改：
点击上传图片，将图片信息上传到数据库。
修改connector/ConnectorServlet.java dopost/doget方法。
我用的是post方式提交的：
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
if (debug) System.out.println("--- BEGIN DOPOST ---");
response.setContentType("text/html; charset=UTF-8");
response.setHeader("Cache-Control","no-cache");
PrintWriter out = response.getWriter();
String commandStr=request.getParameter("Command");
String typeStr=request.getParameter("Type");
String currentFolderStr=request.getParameter("CurrentFolder");
String currentPath=baseDir+typeStr+currentFolderStr;
// System.out.println(currentPath);
String currentDirPath=getServletContext().getRealPath(currentPath);
if (debug) System.out.println(currentDirPath);
String retVal="0";
String newName="";
if(!commandStr.equals("FileUpload"))
retVal="203";
else {
DiskFileUpload upload = new DiskFileUpload();
try {
List items = upload.parseRequest(request);
Map fields=new HashMap();
Iterator iter = items.iterator();
while (iter.hasNext()) {
FileItem item = (FileItem) iter.next();
if (item.isFormField())
fields.put(item.getFieldName(),item.getString());
else
fields.put(item.getFieldName(),item);
}
FileItem uplFile=(FileItem)fields.get("NewFile");
String fileNameLong=uplFile.getName();
// System.out.println(fileNameLong);
fileNameLong=fileNameLong.replace('\\','/');
String[] pathParts=fileNameLong.split("/");
String fileName=pathParts[pathParts.length-1];
// System.out.println(fileName+"ccccccccccc");
String nameWithoutExt=getNameWithoutExtension(fileName);
System.out.println(nameWithoutExt);
String ext=getExtension(fileName);
System.out.println(ext);
// 上传图片信息，添加到数据库中 开始
List <ImageMessage> imlist=new ArrayList<ImageMessage>();
ImageMessage img=new ImageMessage();
img.setImageName(fileName);
img.setImagePaht(currentDirPath);
imlist.add(img);
LinkDatabase link=new LinkDatabase();
link.insertMessage(imlist);
//结束
File pathToSave=new File(currentDirPath,fileName);
int counter=1;
while(pathToSave.exists()){
newName=nameWithoutExt+"("+counter+")"+"."+ext;
retVal="201";
pathToSave=new File(currentDirPath,newName);
counter++;
}
uplFile.write(pathToSave);
}catch (Exception ex) {
retVal="203";
}
}
out.println("<script type=\"text/javascript\">");
out.println("window.parent.frames['frmUpload'].OnUploadCompleted("+retVal+",'"+newName+"');");
out.println("</script>");
out.flush();
out.close();
if (debug) System.out.println("--- END DOPOST ---");
}
三、动态的修改工具栏
修改fckconfig.js文件。
在添加下面代码，把“Default”，改为自定义工具名称。在jsp 页面设置FCKeditor实例 oFCKeditor.setToolbarSet("自定义工具名称");
FCKConfig.ToolbarSets["Default"] = [
['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow','-','About']
] ;
?附件中包括了完整的FCKeditor文件以及配置好的工程源码?
PS:项目中用到了struts2，上传时候同样碰到了权限问题，原来是因为struts2的拦截器导致，所以修改filter-mapping即可以：?
?
?
?
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>*.action</url-pattern>
</filter-mapping>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>*.jsp</url-pattern>
</filter-mapping>
?