FCKeditor2.6学习总结

最新推荐文章于 2024-05-01 00:02:34 发布

iteye_16285

最新推荐文章于 2024-05-01 00:02:34 发布

阅读量432

点赞数

分类专栏： Web UI 文章标签： javascript web.xml java ViewUI

Web UI 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

1、FCK的各种属性：

var FCKeditor = function( instanceName, width, height, toolbarSet, value );

其中instanceName属性为编辑器输出的textarea元素的name属性值，必须指定。

参数会赋给同名属性。

2、以JavaScript方式引用FCKeditor有两种常用方式：

《1》先引人外部js文件

var oFCKeditor = new FCKeditor( 'FCKeditor1' );
//oFCKeditor.Config["CustomConfigurationsPath"] = '/TestFckeditor/fckeditor/myconfig.js' ;
//注意路径问题
// http://localhost:8080/fckeditor
//oFCKeditor.BasePath = "/fckeditor/" ;
// http://localhost:8080/TestFckeditor/fckeditor
oFCKeditor.BasePath="/TestFckeditor/fckeditor/";
oFCKeditor.ToolbarSet="newsAll";
oFCKeditor.Create();

《2》和方法一类似

先引入外部文件<script type="text/javascript" src="fckeditor/fckeditor.js"></script>

</script>

<textarea id="MyTextarea" name="MyTextarea">This is <b>the</b> initial value.</textarea>

3、JSP中通过自定义标签调用FCKeditor：

先复制5个jar包至WEB-INF/lib下面

commons-fileupload-1.2.1.jar

commons-io-1.3.2.jar

fckeditor-java-core-2.6.jar

imageinfo-1.9.jar

slf4j-api-1.5.8.jar

slf4j-simple-1.5.8.jar

引入标签库< %@taglib uri=" http://java.fckeditor.net" prefix="FCK" %>

在需要的位置加入<FCK:editor instanceName="myEditor" basePath="/fckeditor" height="500px" />即可

basePath以“/”开头，并且这个“/”代表当前工程的路径。

value属性值可有可无（修正了以前版本的bug）

4、配置FCKeditor

注意事项：

直接修改主配置文件fckconfig.js

定义单独的配置文件（只需要写需要修改的配置项）

在页面的调用代码中对FCKeditor的实例进行配置

配置加载顺序：

加载主配置文件fckconfig.js

加载自定义配置文件（如果有），覆盖相同的配置项

使用对实例的配置覆盖相同的配置项（只对当前实例有效）

系统会自动侦测并运用适当的界面语言（默认，可以修改）

不能删除主配置文件fckconfig.js

修改配置后要清理缓存，以免影响结果

（或访问时强制刷新也可IE是CTRL+F5；firefox是Shift+CTRL+R）

各种配置简介：

自定义ToolbarSet，去掉一些功能

var oFCKeditor = new FCKeditor( 'FCKeditor1' );

oFCKeditor.ToolbarSet="newsAll";（newsAll是配置ToolbarSet时起的名字）

加几种常用的字体：

FCKConfig.FontNames= '宋体;楷体;黑体;新宋体;仿宋;华文行楷;华文中宋;楷体_GB2312;隶书;幼圆;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

修改“回车”和“Shift+回车”的换行行为。

FCKConfig.EnterMode = 'br' ;// p | div | br
FCKConfig.ShiftEnterMode = 'p' ;// p | div | br

更换表情图片

FCKConfig.SmileyPath= FCKConfig.BasePath + 'images/smiley/wangwang/' ;
FCKConfig.SmileyImages= ['0.gif','1.gif','2.gif','3.gif','4.gif','5.gif','6.gif','7.gif','8.gif','9.gif','10.gif','11.gif','12.gif','13.gif','14.gif','15.gif','16.gif','17.gif','18.gif','19.gif','20.gif','21.gif','22.gif','23.gif','24.gif','25.gif','26.gif','27.gif','28.gif','29.gif','30.gif','31.gif','32.gif','33.gif','34.gif','35.gif','36.gif','37.gif','38.gif','39.gif','40.gif','41.gif','42.gif','43.gif','44.gif','45.gif','46.gif','47.gif','48.gif','49.gif','50.gif','51.gif','52.gif','53.gif','54.gif','55.gif','56.gif','57.gif','58.gif','59.gif','60.gif','61.gif','62.gif','63.gif','64.gif','65.gif','66.gif','67.gif','68.gif','69.gif','70.gif','71.gif','72.gif','73.gif','74.gif','75.gif','76.gif','77.gif','78.gif','79.gif','80.gif','81.gif','82.gif','83.gif','84.gif','85.gif','86.gif','87.gif','88.gif','89.gif','90.gif','91.gif','92.gif','93.gif','94.gif','95.gif','96.gif','97.gif','98.gif'] ;
FCKConfig.SmileyColumns = 8 ;
FCKConfig.SmileyWindowWidth = 668 ;
FCKConfig.SmileyWindowHeight = 480 ;

如果表情窗口过大，可以修改fckeditor/editor/dialog/fck_smiley.html中的内容加以修正：注释掉dialog.SetAutoSize( true ) ;并修改<body style="overflow: hidden">为<body style="overflow: auto">

提示：

配置文件要使用UTF-8编码保存；

FCKConfig.BasePath和调用fckeditor时指定的BasePath（FCKConfig.BasePath）不是同一个，其值也不一样。

5、文件上传

在web.xml中加入一个servlet配置

<servlet>
<servlet-name>ConnectorServlet</servlet-name>
<servlet-class>
net.fckeditor.connector.ConnectorServlet
</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>ConnectorServlet</servlet-name>
<url-pattern>
/fckeditor/editor/filemanager/connectors/*
</url-pattern>
</servlet-mapping>

再在classpath目录下放一个fckeditor.properties文件

在其中加入以下内容

connector.userActionImpl=net.fckeditor.requestcycle.impl.EnabledUserAction

上传文件文件名中文乱码问题在FCKeditor2.6.6以后已被解决；若用的是以前的版本，会出现中文乱码，我们可以重写net.fckeditor.connector.ConnectorServlet这个类，将其中的doPost()方法中的request编码设为UTF-8（upload.setHeaderEncoding("UTF-8")），然后再web.xml中修改servlet的配置；

新建文件夹也会出现乱码，在FCKeditor2.6.6以后也已被解决：若是以前版本同样是在上面重写的类中的doGet()方法中将新建文件夹字符串进行编码后设置进去（String tempStr = request.getParameter("newFolderStr"); tempStr= tempStr.getBytes("ISO8859-1"),"UTF-8"）

上传文件时，我们一般是将文件名用UUID方式修改之后再进行上传；防止中文文件名访问乱码问题（UUID.randomUUID()）

iteye_16285

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
FCKeditor2.6学习总结

1、FCK的各种属性： var FCKeditor = function( instanceName, width, height, toolbarSet, value );其中instanceName属性为编辑器输出的textarea元素的name属性值，必须指定。参数会赋给同名属性。2、以JavaScript方式引用FCKeditor有两种常用方式：《1》先引人...
复制链接

扫一扫