富文本编辑器CHEDITOR的使用与配置

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 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();
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值