推荐两款基于JQuery的在线内容编辑器

最新推荐文章于 2024-11-05 22:56:38 发布

原创最新推荐文章于 2024-11-05 22:56:38 发布 · 905 阅读

CC 4.0 BY-SA版权

9 篇文章

订阅专栏

本文介绍了百度开发的ueditor和kindeditor这两款基于jQuery的在线内容编辑器。ueditor功能强大，但在后端获取多同名输入框时可能出现乱序问题。而kindeditor在textarea失去焦点后会自动同步编辑器内容，易于使用。

一、ueditor

参考文档：http://fex.baidu.com/ueditor/

这是百度开发的编辑器，功能强大，但是有个bug：

当多个同名的输入框

在后端获取到的$_POST['options'] 没有按照页面的顺序排序，会乱序。

注意：ueditor默认会加入<p>标签，如果不加<p>标签，需要在初始化时设置enterTag 参数为空，如

var ue = UE.getEditor('editor',{'enterTag':''});

二、kindeditor

使用示例：

1、在html中加入textarea 输入框

<textarea id="editor_id" name="content" style="width:700px;height:300px;">
<strong>HTML内容</strong>
</textarea>

2、在html底部加入js

KindEditor.ready(function(K) {
    window.editor = K.create('#editor_id',{width:'700px',afterBlur: function(){this.sync();}});
});

注意：如何form表单是用js提交的，那么kindeditor初始化时必须加入

afterBlur: function(){this.sync();}

否则输入的内容无效。

这行代码的意思就是在textarea失去焦点之后执行this.sync();

这个函数就是同步KindEditor的值到textarea文本框。
官方解释：
sync()：将编辑器的内容设置到原来的textarea控件里。

参考文档：http://kindeditor.net/doc.php