摘自:jingyan.baidu.com/article/a65957f4a4c89a24e67f9b3d.html
在使用kindEditor时,因为textarea是动态加载的,因而对textarea的渲染总是不成功,在网上看到了这篇文章,我的问题也解决了,感谢作者,我也收藏下来,以便以后借鉴。
费了“九牛二虎”之力,终于搞定了。
问题经过:
使用dwz前台js框架需要用到kindeditor编辑器,按照kindeditor说明初始化编辑器,
在 IE中没问题。在谷歌浏览器中不加载kindeditor ; 没办法 alert 找错误吧,找到Kindeditor.ready(function(){})的时候 不走了,那就到Kindeditor.js中看看这个 ready 吧, 眼晕了, ready中alert看看吧,发现在谷歌浏览器中死活不走ready中的几个function函数( readyFunc()、 ieReadyFunc()、ieReadyStateFunc()......);
(截图图片,上传不上?why?)
没办法,没时间研究这个了,想个别的招吧;
既然kindeditor的ready不能用了,那就跳过换jquery的吧。
*********************************************
原始的kindeditor初始化时这样的:
KindEditor.ready(function(K){
var editor = K.create(
'#kindeditor',
{
width : "80%", //编辑器的宽度为70%
height : "430px", //编辑器的高度为100px
filterMode : false, //不会过滤HTML代码
resizeMode : 1 ,//编辑器只能调整高度
imageUploadJson : '/kindeditor-4.1.7/jsp/upload_json.jsp',
fileManagerJson : '/kindeditor-4.1.7/jsp/file_manager_json.jsp',
allowUpload : true,
allowFileManager : true,
afterCreate : function() {
var self = this;
K.ctrl(document, 13, function() {
self.sync();
document.forms['example'].submit();
});
K.ctrl(self.edit.doc, 13, function() {
self.sync();
document.forms['example'].submit();
});
},
items : [
'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'code', 'cut', 'copy', 'paste',
'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|',
'table', 'hr', 'pagebreak',
'anchor', 'link', 'unlink', '|', 'image','multiimage','flash','media','insertfile','editImage'
],
afterBlur: function(){this.sync();},//和DWZ 的 Ajax onsubmit 冲突,提交表单时 编辑器失去焦点执行填充内容
newlineTag : "br"
});
});
**************************************************************
我改,注意加粗、倾斜的地方。
问题解决:(原来一步到位直接在kindeditor.ready中完成,现在分两步)
封装下kindeditor初始化函数:
function kedit(keid){
alert(1);
var keditor = KindEditor.create(
'#' + keid,
{
width : "80%", //编辑器的宽度为70%
height : "430px", //编辑器的高度为100px
filterMode : false, //不会过滤HTML代码
resizeMode : 1 ,//编辑器只能调整高度
imageUploadJson : '/kindeditor-4.1.7/jsp/upload_json.jsp',
fileManagerJson : '/kindeditor-4.1.7/jsp/file_manager_json.jsp',
allowUpload : true,
allowFileManager : true,
afterCreate : function() {
var self = this;
KindEditor.ctrl(document, 13, function() {
self.sync();
document.forms['example'].submit();
});
KindEditor.ctrl(self.edit.doc, 13, function() {
self.sync();
document.forms['example'].submit();
});
},
items : [
'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'code', 'cut', 'copy', 'paste',
'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|',
'table', 'hr', 'pagebreak',
'anchor', 'link', 'unlink', '|', 'image','multiimage','flash','media','insertfile','editImage'
],
afterBlur: function(){this.sync();},//和DWZ 的 Ajax onsubmit 冲突,提交表单时 编辑器失去焦点执行填充内容
newlineTag : "br"
});
alert(1);
}
在使用的地方用jquery的ready调用
<SCRIPT type="text/javascript">
$(function (){
alert(1);
kedit("kindeditor");
});
</SCRIPT>
//
测试 IE下正常、谷歌也正常了 OK。
个人的一点小经验 希望能帮到有用的朋友。