Question

我通过ajax获取此代码：

<script>
$(function(){
$('#responseContent').ckeditor();
});
</script>
<textarea id='responseContent'></textarea>

它成功生成了一个CKEditor窗格，用于精美的文本编辑。

当第二次调用同一段代码时，我得到一个空白区域。奇怪的是，当我对textarea / ckeditor应该在哪里做“检查元素”时，它说：

<textarea id="responseContent" style="visibility: hidden; "></textarea>

所以，作为我的专业黑客，我jQuery它所以是可见性：可见。 CSS卡住但结果看起来并没有什么不同。

你如何让ckeditor工作......一直......用ajax生成的数据？

编辑：为了清楚起见，我不相信这是一个CSS问题。我相信这是一个jquery / ckeditor问题。

Answer 1

在这里找到答案：CKEditor instance already exists

if(CKEDITOR.instances[editorName]) {
delete CKEDITOR.instances[editorName];
CKEDITOR.replace(editorName);
}

我不确定的一件事（作为ckeditor noob）是“editorName”。这是在其上创建的元素的ID。我相信它也可以是类名，如果你用它来创建它。

所以，在我原来问题的例子中：

<script>
    $(function(){
    $('#responseContent').ckeditor();
});
</script>
<textarea id='responseContent'></textarea>

我会这样修理：

if(CKEDITOR.instances["responseContent"]) {
    delete CKEDITOR.instances["responseContent"];
    // I replaced this step
    // CKEDITOR.replace("responseContent");
    // With this:
    $('#responseContent').ckeditor();
}

Answer 2

我猜你正在尝试用不同的内容填充ckeditor的同一个实例，对吗？

如果是这样，那么还有其他方法可以更改该内容。尝试创建其他实例会导致问题。

http://ckeditor.com/blog/CKEditor_for_jQuery

向下滚动到“与编辑器实例进行代码交互”

Answer 3

正确的方法是这样的：

jQuery.each(CKEDITOR.instances, function(){
     eval("CKEDITOR.instances."+this.name+".destroy(true)");
});

Answer 4

这个脚本可以帮助你使用'.ckeditor'类加载ajax textareas：

$('#edytuj_promocje').load('your_php_file_with_ckeditor_textarea.php', function(){

   $.each(CKEDITOR.instances, function(){
     eval("CKEDITOR.instances."+this.name+".destroy(true)");
   });
   $('.ckeditor').each( function(){ 
    CKEDITOR.replace(this);
   });
});

第二次ajax加载后CKEditor消失

4 个答案: