CKEDITOR使用与配置
安装:
下载CKEDITOR的文件,解压后复制到工程的WEBROOT目录下就OK!
引用CKEDITOR的JS文件:
新建JSP页面,添加其JS文件
注意:1.src的路径。
2.不要写成<script type="text/javascript" src="ckeditor/ckeditor.js />样式,在现有的3.0.1版本中会出现CKEDITOR未定义的脚本错误提示,致使不能生成编辑器。
替换TEXTAREA标签:
注意:要在textarea后面加入javascript.如果要在HEAD区写javasript,那么采用如下代码:
好了到此一个默认的CKEDITOR就配置完毕了,可以去页面看看它的模样了。
当然还有一个方法CKEDITOR.appendTo(elementOrId, config) 它可以在特定的dom对象中创建CKEDITOR
可参考:[url]http://www.cnblogs.com/Fskjb/archive/2009/11/16/1603461.html[/url]
项目调用示例:
安装:
下载CKEDITOR的文件,解压后复制到工程的WEBROOT目录下就OK!
引用CKEDITOR的JS文件:
新建JSP页面,添加其JS文件
注意:1.src的路径。
2.不要写成<script type="text/javascript" src="ckeditor/ckeditor.js />样式,在现有的3.0.1版本中会出现CKEDITOR未定义的脚本错误提示,致使不能生成编辑器。
替换TEXTAREA标签:
<textarea rows="30" cols="50" name="editor01">请输入.</textarea>
<script type="text/javascript">CKEDITOR.replace('editor01');</script>
注意:要在textarea后面加入javascript.如果要在HEAD区写javasript,那么采用如下代码:
<script type="text/javascript">
window.onload = function()
{
CKEDITOR.replace( 'editor01' );
};
</script>
好了到此一个默认的CKEDITOR就配置完毕了,可以去页面看看它的模样了。
当然还有一个方法CKEDITOR.appendTo(elementOrId, config) 它可以在特定的dom对象中创建CKEDITOR
<div id="editorSpace"><:/div>
CKEDITOR.appendTo( 'editorSpace' );
可参考:[url]http://www.cnblogs.com/Fskjb/archive/2009/11/16/1603461.html[/url]
项目调用示例:
//将textarea替换成富文本
CKEDITOR.replace( "demo", {
toolbar : 'Basic'
});
// ......
//获取富文本框中的值
var demo2=CKEDITOR.instances.demo.getData();
//如果存在中文乱码问题,需要对文本信息进行两次编码
demo2=encodeURIComponent(demo2);
demo2=encodeURIComponent(demo2);
String demo = StringUtils.getParameter(request, "demo2");
//后台再通过解码获得中文
try {
demo = URLDecoder.decode(demo, "UTF-8");
} catch (Exception e) {
e.printStackTrace();
}