FCK的使用简介
引入网页:
首先下载附件中FCK提高的编辑器代码,也可以到其官方网站http://www.fckeditor.net去下载和看帮助文档。
把FCKeditor_2.6.3.zip解压copy里面的fckeditor到我们的工程中,再 把fckeditor-java-2.4-bin.zip里面的5个jar包copy到lib下面去。FCK提供了几种引入方式:
- 通过js调用。引入<script type=“text/javascript” src=“fckeditor/fckeditor.js”></script>,在需要插入编辑器的地方通过下面代码创建
var oFCKeditor=new FCKeditor('eidtor'); oFCKeditor.BasePath="/fckTest/fckeditor/"; oFCKeditor.Create();
-
通过jsp标签调用。引人<%@ taglib uri="http://java.fckeditor.net" prefix="fck"%>,在需要插入编辑器的地方通过下面代码创建
<fck:editor instanceName="editor" basePath="/fckeditor" value=" " width="90%" height="300" toolbarSet="DEFAULT"/>
属性设置:
属性名 |
描述 |
默认值 |
Width |
宽度 |
100% |
Height |
高度 |
200 |
Value |
初始化值 |
空字符串 |
ToolbarSet |
工具条集合的名称(Basic|Default) |
Default |
BasePath |
编辑器的基路径 |
/fckeditor/ |
说明:value初始化时必须提供一个初始化值,通常为“ ”,因为如果不这样的话会报NullPointerExcepton,这也算FCK的一个Bug,不过也可以通过修改它net.fckeditor.FCKeditor解决,在我提供的例子中有说明。
自定义配置:
在属性中有一个ToolbarSet的工具条属性,默认为Default,实际上我们可以定义自己的属性条,方法是通过修改fckeditor下面的fckconfig.js,而更合理的方式是新建一个自己的配置文件newconfig.js,然后在在fckconfig.js中指定使用自己的配置文件也就是告诉其自己的配置文件在什么地方FCKConfig.CustomConfigurationsPath = '/fcktest/newconfig.js' ;
//设置自定义的工具栏
FCKConfig.ToolbarSets["DIY"] = [ ['Style','FontFormat'], ['FontName','FontSize','Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript','-','TextColor','BGColor'], '/', ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'], ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], '/', ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'], ['Link','Unlink','Anchor'], ['-','NewPage','Preview','FitWindow','ShowBlocks','Source'] ] ;
说明:[]代表的是一组,-代表的是竖分割线,/代表换行
此外,还可以自定义其他的配置,比如可以设置皮肤、更换字体、更换表情图片等。可以自己去研究……
图片上传:
FCK自带了一个后台图片上次的处理器(实际上是个Servlet),但是它自带的东西不满足我们的需求,而且老外的东西当我们处理中文名字的图片会有乱码,所以需要修改,要进行图片上传首先做以下事情
-
在src下新建一个文件fckeditor.properties 并在其中添加connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl
2. 建立一个Connector,copy net.fckeditor.connector.ConnectorServlet的源码到我们自己定义的Connector,根据需求,上传的图片我们自己重命名,那么找到filename,用filename=ID.nextID()+"."+extension;替代。
3. 在Web.xml里面声明这个servlet
<servlet>
<servlet-name>ConnectorServlet</servlet-name> <servlet-class>connector.ConnectorServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>ConnectorServlet</servlet-name> <url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern> </servlet-mapping>
4.其他方面,比如更改url,限制文件上传大小等需求可以自己去探索研究哈。
给FCK瘦身:删除fckeditor目录下面所有以“_”开头的文件或者文件夹,像"_samples"、"_documentation.html“等
删除fckeditor目录下面除了,fckconfig.js fckpackage.xml fckstyles.xml fcktemplates.xml外的所有文件,当然要保留editor文件夹
删除fckeditor/editor/lang目录下面除了en.js、 zh-cn.js外的所有文件
删除fckeditor\editor\filemanager目录下面的connectors文件夹
删除editor\skins目录下面除了default下面的文件夹,这个里面是皮肤,共有三种,可以在fckconfig.js里面设置。
上一篇: Matplotlib画图
下一篇: matplotlib画图
推荐阅读
-
如何使用css3实现一个类在线直播的队列动画的示例代码
-
使用navicat导入sql文件的方法步骤
-
安全测试工具IBM Rational AppScan中文版的使用教程
-
yii 使用renderPartial调用另外一个控制器的视图
-
PHP扩展开发-数组的使用以及HashTable简介
-
PHP读取文本文件并逐行输出该行使用最多的字符串及对应次数
-
使用php的HTTP请求的库Requests实现美女图片墙,
-
使用uploadify上传大于3兆的文件时显示成功,但是没有上传到文件夹中
-
thinkphp中开启smarty是否不能使用默认的模板布局?
-
大家使用过mysql 严格模式没有?帮忙看一下这个简单的SQL语句出了什么问题?