没有定义CKEditor UI空间

CKEditor UI Space not being defined

本文关键字：UI 空间 CKEditor 定义      更新时间：2023-09-26
当我尝试运行ckeditor功能时，

editor.ui.space被设置为null。

我用ajax拉入我的内容，成功或完成后，我然后插入html到dom，然后我直接尝试绑定我的编辑器与默认选项。

的例子:

$.get('url', function(data){
    $('body').html(data.content);
    $('textarea.content').ckeditor();
});

这个会立即失效，因为没有设置ui-空格。我不知道为什么，但是如果我设置一个超时，比如500，并运行ckeditor函数，它工作得很好。

$.get('url', function(data){
    $('body').html(data.content);
    var t = setTimeout(function() {
        // This does work fine with no problems, why?
        $('textarea.content').ckeditor();
        clearTimeout(t);
    }, 500);
});

我今天也遇到了同样的问题。

在我的例子中，我只是改变:

<script src="{{ asset('js/app.js') }}"defer></script>

: 

<script src="{{ asset('js/app.js') }}"></script>

在Laravel中，我注意到如果我从头部部分省略或禁用app.js脚本，这个问题就会消失。

查看标题部分并找出

<script src="{{ asset('js/app.js') }}" defer></script>

现在删除它或注释它

//<script src="{{ asset('js/app.js') }}" defer></script>

注意:App.js脚本是必需的，如果你使用vue.js在你的页面。如果是这样，你必须找出另一个解决方案。

我不使用vue.js，所以我把它删掉了。

注意:

我知道，这不是一个成熟的答案。但它可以帮助其他人找到真正的解决方案。

jquery html函数是同步的，但内容仍然需要时间来加载，这有时还不能调用$('textarea.content').ckeditor();

请尝试这个而不是超时，以确保在初始化ckeditor之前内容可用，超时是一个解决方案，但它不是一个可靠的。

$.get('url', function(data){
    $('body').html(data.content).promise().done(function() {
         $('textarea.content').ckeditor();
    });
});

window.onload = function(){
        setTimeout(function(){
            //CKEDITOR
            CKEDITOR.replace('selector_ID');
            CKEDITOR.config.height = 100;
            //END CKEDITOR
        },0);
    }

我在一个使用AngularJS和JQuery的网站上有同样的问题。这似乎是通过在JQuery 'document.ready()'指令中初始化CkEditor(版本4…)来解决的，以确保它是最后一个要运行的Javascript库。

<script language="javascript" >
$(document).ready(
    function()
    {
        CKEDITOR.replace( 'editor' );
    }
 );
 </script>

相关文章：