kindeditor异步加载 无法初始化

Posted _DongGe

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了kindeditor异步加载 无法初始化相关的知识,希望对你有一定的参考价值。

使用集成的php输出kindeditor无法初始化

function showEditor($id, $value=\'\', $width=\'700px\', $height=\'300px\', $style=\'visibility:hidden;\',$upload_state="true", $media_open=false, $type=\'all\'){
    //是否开启多媒体
    $media = \'\';
    if ($media_open){
        $media = ", \'flash\', \'media\'";
    }
    switch($type) {
    case \'basic\':
        $items = "[\'source\', \'|\', \'fullscreen\', \'undo\', \'redo\', \'cut\', \'copy\', \'paste\', \'|\', \'about\']";
        break;
    case \'simple\':
        $items = "[\'source\', \'|\', \'fullscreen\', \'undo\', \'redo\', \'cut\', \'copy\', \'paste\', \'|\',
            \'fontname\', \'fontsize\', \'forecolor\', \'hilitecolor\', \'bold\', \'italic\', \'underline\',
            \'removeformat\', \'justifyleft\', \'justifycenter\', \'justifyright\', \'insertorderedlist\',
            \'insertunorderedlist\', \'|\', \'emoticons\', \'image\', \'link\', \'|\', \'about\']";
        break;
    default:
        $items = "[\'source\', \'|\', \'fullscreen\', \'undo\', \'redo\', \'print\', \'cut\', \'copy\', \'paste\',
            \'plainpaste\', \'wordpaste\', \'|\', \'justifyleft\', \'justifycenter\', \'justifyright\',
            \'justifyfull\', \'insertorderedlist\', \'insertunorderedlist\', \'indent\', \'outdent\', \'subscript\',
            \'superscript\', \'|\', \'selectall\', \'clearhtml\',\'quickformat\',\'|\',
            \'formatblock\', \'fontname\', \'fontsize\', \'|\', \'forecolor\', \'hilitecolor\', \'bold\',
            \'italic\', \'underline\', \'strikethrough\', \'lineheight\', \'removeformat\', \'|\', \'image\'".$media.", \'table\', \'hr\', \'emoticons\', \'link\', \'unlink\', \'|\', \'about\']";
        break;
    }
    //图片、Flash、视频、文件的本地上传都可开启。默认只有图片,要启用其它的需要修改resource\\kindeditor\\php下的upload_json.php的相关参数
    echo \'<textarea id="\'. $id .\'" name="\'. $id .\'" style="width:\'. $width .\';height:\'. $height .\';\'. $style .\'">\'.$value.\'</textarea>\';
        echo \'<script src="\'. RESOURCE_SITE_URL .\'/kindeditor/kindeditor-min.js" charset="utf-8"></script>\';
    echo \'
<script src="\'. RESOURCE_SITE_URL .\'/kindeditor/kindeditor-min.js" charset="utf-8"></script>
<script src="\'. RESOURCE_SITE_URL .\'/kindeditor/lang/zh_CN.js" charset="utf-8"></script>
<script>
    var KE;
  KindEditor.ready(function(K) {
        KE = K.create("textarea[name=\\\'\'.$id.\'\\\']", {
                        items : \'.$items.\',
                        cssPath : "\' . RESOURCE_SITE_URL . \'/kindeditor/themes/default/default.css",
                        allowImageUpload : \'.$upload_state.\',
                        allowFlashUpload : false,
                        allowMediaUpload : false,
                        allowFileManager : false,
                        syncType:"form",
                        afterCreate : function() {
                            var self = this;
                            self.sync();
                        },
                        afterChange : function() {
                            var self = this;
                            self.sync();
                        },
                        afterBlur : function() {
                            var self = this;
                            self.sync();
                        }
        });
            KE.appendHtml = function(id,val) {
                this.html(this.html() + val);
                if (this.isCreated) {
                    var cmd = this.cmd;
                    cmd.range.selectNodeContents(cmd.doc.body).collapse(false);
                    cmd.select();
                }
                return this;
            }
    });
</script>
    \';
 return true;
}

 

页面直接引用php <?php showEditor(\'content\');?>发现无法初始化

后来发现 异步加载主要的问题是KindEditor.ready无法执行,修改在页面上引用即可

<script src="<?php echo RESOURCE_SITE_URL.DS.\'kindeditor/kindeditor-min.js\';?>" charset="utf-8"></script>
<script src="<?php echo RESOURCE_SITE_URL.DS.\'kindeditor/lang/zh_CN.js\';?>" charset="utf-8"></script>
<script>
        KindEditor.basePath = \'/data/resource/kindeditor/\';
    KindEditor.create("#file_content", {
                        items : [\'source\', \'|\', \'fullscreen\', \'undo\', \'redo\', \'print\', \'cut\', \'copy\', \'paste\',
            \'plainpaste\', \'wordpaste\', \'|\', \'justifyleft\', \'justifycenter\', \'justifyright\',
            \'justifyfull\', \'insertorderedlist\', \'insertunorderedlist\', \'indent\', \'outdent\', \'subscript\',
            \'superscript\', \'|\', \'selectall\', \'clearhtml\',\'quickformat\',\'|\',
            \'formatblock\', \'fontname\', \'fontsize\', \'|\', \'forecolor\', \'hilitecolor\', \'bold\',
            \'italic\', \'underline\', \'strikethrough\', \'lineheight\', \'removeformat\', \'|\', \'image\', \'table\', \'hr\', \'emoticons\', \'link\', \'unlink\', \'|\', \'about\'],
                        //cssPath : "<?php echo RESOURCE_SITE_URL.DS.\'kindeditor/themes/default/default.css\';?>",
                        allowImageUpload : true,
                        allowFlashUpload : false,
                        allowMediaUpload : false,
                        allowFileManager : false,
                        syncType:"form",
                        afterCreate : function() {
                            var self = this;
                            self.sync();
                        },
                        afterChange : function() {
                            var self = this;
                            self.sync();
                        },
                        afterBlur : function() {
                            var self = this;
                            self.sync();
                        }
        });
        KindEditor.appendHtml = function(id,val) {
                this.html(this.html() + val);
                if (this.isCreated) {
                        var cmd = this.cmd;
                        cmd.range.selectNodeContents(cmd.doc.body).collapse(false);
                        cmd.select();
                }
                return this;
        }
</script>

 参考:http://www.cnblogs.com/zuri/p/6846866.html

http://kindeditor.net/view.php?bbsid=4&postid=6206

以上是关于kindeditor异步加载 无法初始化的主要内容,如果未能解决你的问题,请参考以下文章

当片段视图加载是异步任务的一部分时,如何在片段加载之前显示进度条?

php中如何使用KindEditor编辑器

当活动中的异步任务完成时如何在片段中重新加载ui?

如何延迟或异步此 WordPress javascript 片段以最后加载以加快页面加载时间?

异步任务片段背景数据

Kindeditor问题