如何使用 jQuery 隐藏和显示 CKEditor？

Question

以下代码应该允许隐藏/显示 CKEditor 表单

<a onClick="$('#form1').hide();">Hide</a>
<a onClick="$('#form1').show();">Show</a>
<form action="sample_posteddata.php" method="post" id="form1">
    <textarea id="editor1" name="editor1">blabla</textarea>
    <script type="text/javascript"> CKEDITOR.replace( 'editor1' ); </script>
    <input type="submit" value="Submit" />
</form>

但是，此代码在 Chrome 上运行良好，但在 Firefox 上，一旦我切换了编辑器（单击“隐藏”然后单击“显示”），它就变得不可编辑!!

我怎样才能让它在每个浏览器上运行？

谢谢。

Answer 1

解决方案是：

// Hide form
CKEDITOR.instances.editor1.updateElement();
CKEDITOR.instances.editor1.destroy();
$('#form1').hide();
//Show form
CKEDITOR.replace( 'editor1', {height: "220px", skin: "v2"});
$('#form1').show();

Answer 2

我在 http:// 找到了答案dizkover.com/post/67/how-to-show-hide-ckeditor-using-jquery-ckeditor-tip

所以基本上，您必须首先通过执行 ff 来销毁 CKEditor 实例：

if(typeof CKEDITOR.instances['element_name'] != 'undefined') {
    CKEDITOR.instances['element_name'].updateElement();
    CKEDITOR.instances['element_name'].destroy();
}

Answer 3

看起来这可能会帮助您：

http://dev.ckeditor.com/ticket/544

在我链接的报告中，他们展示了这样的尝试：

if (frames[0]) {
  frames[0].FCK.EditingArea.MakeEditable();
}

Answer 4

似乎没有真正的解决方法。

请参阅此处了解更多信息。唯一的解决办法就是等待CKEditor新版本3.4。

Answer 5

<div id="container">            
    <textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10"></textarea>
</div>
<p>
    <input type="button" value="jQuery Hide" onclick="$('#container').hide('fast');" />
    <input type="button" value="jQuery Show" onclick="$('#container').show('fast');" />
</p>

Answer 6

尝试将其包装在 div 中，例如：

<表格>...

并使隐藏显示在 div 上。

Answer 7

$("div[id*='cke_editor']").hide();

$("div[id*='cke_editor']").show();

对于我的 CckEditor 4