zoukankan      html  css  js  c++  java
  • kinEditor动态渲染的问题

    摘自: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。

    个人的一点小经验 希望能帮到有用的朋友。

  • 相关阅读:
    poj 3744 Scout YYF I (矩阵快速幂 优化 概率dp)
    Codeforces Round #272 (Div. 2) D. Dreamoon and Sets (思维 数学 规律)
    Codeforces Round #272 (Div. 2) C. Dreamoon and Sums (数学 思维)
    hdu 5067 Harry And Dig Machine (状态压缩dp)
    hdu 4810 Wall Painting (组合数学+二进制)
    hdu 4856 Tunnels (bfs + 状压dp)
    tc srm 636 div2 500
    poj 2096 Collecting Bugs (概率dp 天数期望)
    ABC182 F Valid payments
    AT2699 [ARC081D] Flip and Rectangles
  • 原文地址:https://www.cnblogs.com/fsh1542115262/p/3989220.html
Copyright © 2011-2022 走看看