easyui-dialog中无法显示KindEditor插件
KindEditor是一种用起来还不错的富文本编辑器插件;easyui是一个前端插件,其中有一个弹出框功能——dialog。在实际使用的时候,我们需要在弹出框当中展示富文本编辑器,从而进行编辑和保存功能,再进行后台的操作。但是我在使用easyui的弹出框的时候出现了问题,无法显示kindeditor插件,而不在dialog中使用时候是可以显示的,这是为什么?要怎么解决?
- 问题发生的原因
dialog在弹出框时的初始化操作,没有成功初始化KindEditor - 解决方式
在easyui的dialog初始化的onOpen方法中来初始化kindeditor:
$(‘#list1’).dialog({
onOpen: function(){
editor1 = KindEditor.create(‘#summary1’, {
height :”300px”,
uploadJson : ‘../cycx/picFtpUpload.do’,
afterBlur: function () {
this.sync();
},
filterMode: true,//是否开启过滤模式
allowFileManager: true,
afterChange : function() {
},
onBeforeClose: function (event, ui) {
// 关闭Dialog前移除编辑器
editor1.remove(‘#summary1’);
},
items : [ ‘source’, ‘|’, ‘undo’, ‘redo’, ‘|’, ‘cut’, ‘copy’, ‘paste’,
‘plainpaste’, ‘wordpaste’, ‘|’, ‘justifyleft’, ‘justifycenter’, ‘justifyright’,
‘justifyfull’, ‘subscript’,
‘superscript’, ‘quickformat’, ‘|’,
‘formatblock’, ‘fontname’, ‘fontsize’, ‘|’, ‘/’,’forecolor’, ‘hilitecolor’, ‘bold’,
‘italic’, ‘underline’, ‘strikethrough’, ‘lineheight’, ‘removeformat’, ‘|’, ‘image’,
‘table’, ‘hr’, ‘pagebreak’,
‘link’, ‘unlink’, ‘about’, ‘|’]
});
},
onClose:function(){
editor1.remove(‘#summary1’);
},
modal: true
});
参考文章:http://blog.csdn.net/qinnimei/article/details/77319684