Question

我目前正在使用CKEditor，当我点击时，我在删除工具栏时遇到了一些麻烦。目前我想在用户点击它时动态创建CKEditor实例。

然而，当我试图点击而不点击工具栏时出现问题。当我尝试在工具栏上单击时停留在那里并且它不会运行我的任何onBlur代码。只有当我单击工具栏上的按钮或单击然后再单击返回文本区域时，它才会删除工具栏并运行我的onBlur代码。

这里是我编写的一小段代码，用于在点击时创建实例。我在这里做错了什么，或者我错过了一段焦点代码？

    <html>
        <head>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
            <script src="ckeditor\ckeditor.js"></script>
            <script>
            $(document).ready(function(){
                CKEDITOR.disableAutoInline = true;

                $("#abc").on('click', function(){
                    var ck = CKEDITOR.inline(CKEDITOR.document.getById('abc'));
                });
            });

            </script>
        </head>

        <body>

            <div id="abc" contenteditable="true" >
                Edit this
            </div>
        </body>
    </html>

Answer 1

尝试在点击时删除jquery并简单地允许ckeditor处理它

$(document).ready(function () {
    CKEDITOR.disableAutoInline = true;
    CKEDITOR.inline('abc');
 });

OR

var abcEditor = CKEDITOR.inline('abc');

Answer 2

因此，我没有点击它，而是在页面加载时找到所有内容可编辑区域并创建ckeditor实例。

最初我想在click上使用动态创建实例，因为我将动态填充内容。但是，我发现在创建动态内容时更容易创建一个ckeditor实例。

使用此函数，我可以在创建动态内容时创建新的ckeditor实例，并使用onblur函数将所有内容写入我的数据库。

如果任何人有任何解决方案从ckediter获取原始html，请告诉我。这个方法必须得到父，然后找到该元素，然后保存它，这对我来说听起来不对。所以，如果你有任何关于如何做到这一点的建议我都是开放的耳朵！谢谢！

        if(CKEDITOR.instances[this.id] == undefined){
            console.log("creating new instance");
            var ck = CKEDITOR.inline(CKEDITOR.document.getById(  this.id ));

            ck.on('blur', function(e){
                var id = e.editor.name;
                var html = $("#"+id).parent()[0].outerHTML;
                console.log(html);
                $.ajax({
                    type: 'POST',
                    url: "saveHtml",
                    data: { content : html}
                }).done(function(data) {
                    console.log(data);
                    console.log("finished sending data");
                });
            });
        }else{
            console.log("no instance created");
        }

在我点击它之前，CKEditor无法删除工具栏

2 个答案: