修改的Kissy富文本编辑器

这几天一直在寻找好用的在线富文本编辑器,本人的要求并不要,不需要有太多的功能,找来找去觉得Kissy Editor 更适合自己,功能满足要求,而且界面简洁令人看着舒坦。但是有一些问题:

1. 最大字符数不能根据需要设置,只能在js里改,这样如果多处要用这个编辑器且要求的字数不一样,这就不好办了。

2. 编辑器有一个小bug,只有在IE里才有。输入一段文字后再清空输入域,你会发现输入域并没有完全空,使用source模式可以看到有一小段样式代码

3. 不能定制编辑器,比如有些地方只需要少许功能,有些地方只需要一个计数功能,有些地方需要所有功能。

4. 下拉菜单的样式不好看

笔者花了一些时间对以上几点做了改进。给KISSY.Editor增加一个属性KISSY.Editor.customized = {type:"normal", maxTextLength:100};然后修改了一下代码:

KISSY.Editor.add("config", function (a) { 
     if(a.customized.type === "countonly") { 
         a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:[], statusbar:["wordcount"], pluginsConfig:{}}; 
     } 
     else if(a.customized.type === "simple") { 
         a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:["source", "", "fontName", "fontSize", "bold", "italic"], statusbar:["wordcount"], pluginsConfig:{}}; 
     } 
     else if(a.customized.type === "normal") { 
         a.config = {base:"res/kissy/", language:"zh-cn", theme:"default", toolbar:["source", "", "fontName", "fontSize", "bold", "italic", "underline", "strikeThrough", "foreColor", "backColor", "", "link", "", "insertOrderedList", "insertUnorderedList", "justifyLeft", "justifyCenter", "justifyRight"], statusbar:["wordcount",  "resize"], pluginsConfig:{}}; 
     } 
     else { 
         a.config = {}; 
     } 
});

如何在页面上使用?

<textarea id="textarea1" style="width:450px;height:200px;">123456</textarea>

KSSY.Editor.customized = {type:"normal", textMaxLength:500};

var editor = new KISSY.Editor("textarea1", undefined);

editor.contentDoc.body.innerHTML="hello";

如果要在JS里设置给输入域赋值,可以这样:

editor.contentDoc.body.innerHTML="hello";

如果要获得输入域的值可以调用editor.getContentDocData()

你可能感兴趣的:(IE)