Javascript 动态创建元素上的CKEDITOR内联（可拖放/可排序）

让我们以jquery为例： 当我将元素从右列表移动到左列表时，我希望为被克隆的已删除元素的文本提供一个内联编辑器。 以下是我尝试过的：

$("#maincontent").droppable({
   drop: function(event, ui) {
        var blockId = ui.draggable.attr('block-id');
        ui.draggable.load(site_url+'/blocks/'+blockId+'.html');
        ui.draggable.attr('contenteditable','true');
        ui.draggable.css('width','100%');
        ui.draggable.css('height','auto');
        CKEDITOR.inline( ui.draggable.get( 0 ) );
   },
   over: function(event, ui) {}
});

我的问题是，我得到了这个错误：[取消捕获编辑器实例“editor2”已经附加到提供的元素]并且显然可排序列表不再工作

奇怪的是，ckeditor确实为新克隆的元素工作

我看到了这个例子：但我就是不明白为什么我会出现这个错误，为什么不能使用可排序列表。 有人能帮我理解吗

这是我的密码：

谢谢

---

更新：一段时间后，我成功地做到了这一点，下面是我的教程：

当我们有相同的场景时，我们也面临同样的问题。在该用户拖放编辑器中，单击页面上的type元素，即可输入文本

我们发现CKeditor与物理DOM元素绑定，该元素在执行“$（document）.ready（）”函数时已经存在于页面上，而不是与动态添加的元素绑定

因此，我们将使用contenteditable=“true”创建一个div，并在document.ready中添加内联CKeditor函数，然后单击dynamic element，我们将隐藏该元素并在dynamic element上显示完全相同的CKeditor div宽度和高度

---

然后，用户输入一些文本并单击外部编辑器，我们捕获CKeditor的focusout事件，并在CKeditor中获取内容，将其放入动态元素中，隐藏CKeditor div并显示元素

我不确定这是否是处理该场景的最佳方法，但您可以在添加新实例之前销毁现有的CKEditor实例。例如：

removeCKEditor: function() {
    if (typeof CKEDITOR == 'undefined') return;
    for (var k in CKEDITOR.instances) {
        var instance = CKEDITOR.instances[k];
        instance.destroy();
    }
}

---

你能提供一个小提琴手吗。。！！这真的很有帮助是的，提琴就可以了。在您尝试初始化编辑器之前，很难理解元素会发生什么。嗨，伙计们……这是我为您制作的。这是我试图使用的代码：。您可以在控制台中看到错误。如果注释CKEditor行，则可排序元素将起作用。谢谢你的帮助。这似乎不是解决这个问题的好办法。我不知道为什么不能像这个例子那样工作：。应该是一样的，对吧？比如说谢谢你@Drk_外星人。我会检查我的代码并尝试像这样实现，如果我发现哪个更重要，我会返回2Uhelpful@Drk_alien这对我真的很有帮助。我将改变我的代码，并按照你的建议实现它。我想我已经尝试过了，但没有帮到我。但是谢谢