我正在尝试将tinyMCE编辑器添加到我的页面，将其删除，然后再次添加它，但我遇到了错误。
当我运行A部分，然后是B部分，再比A部分时，我得到错误：
Error: g.win.document is null
Source File: tiny_mce/tiny_mce.js Line: 1
A部分
js += " tinyMCE.init({ ";
js += " 'mode' : 'exact', \n";
js += " 'elements' : '" + ctrl.ID + "Editor', \n";
js += " 'plugins' : 'insertdatetime,TVCMSLink,TVCMSImage',\n";
js += " 'theme' : 'advanced',\n";
js += " 'theme_advanced_layout_manager' : 'SimpleLayout',\n";
js += " 'theme_advanced_buttons1' : 'backcolor, forecolor, |, bold, underline, strikethrough, |, numlist, bullist, charmap, |, undo, redo, |, anchor, link, tvlink, unlink',\n";
js += " 'theme_advanced_buttons2' : '',\n";
js += " 'theme_advanced_buttons3' : ''\n";
js += " });\n";
B部分
js += " tinyMCE.getInstanceById('" + ctrl.ID + "Editor').remove();\n";
编辑：
以上是创建JavaScript的后端spinets ......下面是完整的JavaScript函数。第一次通过它打开对话框并工作，内容在编辑器中，没有错误。单击关闭按钮时，对话框将关闭。当我再次运行该功能时，会显示对话框，但编辑器为空，并且出现上述错误。
function show_HP1B0() {
$('.EditLink').hide();
$.ajax({
type: 'post',
url: 'genericHandler.ashx',
data: 'cmd=select&tableName=ExtraBlocks&id=4',
dataType: 'json',
success: function(data) {
$('#HP1B0Editor').html(data['rows'][0]['Content']);
alert($('#HP1B0Editor').html());
tinyMCE.init({ 'mode' : 'exact',
'elements' : 'HP1B0Editor',
'plugins' : 'insertdatetime,Link,Image',
'theme' : 'advanced',
'theme_advanced_layout_manager' : 'SimpleLayout',
'theme_advanced_buttons1' : 'backcolor, forecolor, |, bold, underline, strikethrough, |, numlist, bullist, charmap, |, undo, redo, |, anchor, link, tvlink, unlink',
'theme_advanced_buttons2' : '',
'theme_advanced_buttons3' : ''
});
var dlg = $('#ctl00_EXTRA_HTML_0_HP1B0Editor').dialog({
modal: false,
draggable: false,
position: 'center',
zIndex: 99999, // Above the overlay
width: 370,
title: 'Content Block Editor',
closeText: '',
open: function () {
$('body').css('overflow', 'hidden');
if ($.browser.msie) { $('html').css('overflow', 'hidden'); } $('<div>').attr('id', 'loader').appendTo('body').show();
},
close: function () { $('body').css('overflow', 'auto'); if ($.browser.msie) { $('html').css('overflow', 'auto'); } $('#loader').remove(); },
buttons: {
'Save': function () {
tinyMCE.getInstanceById('HP1B0Editor').remove();
$('.EditLink').show();
$(this).dialog('close');
},
'Cancel': function () {
alert('HP1B0Editor');
tinyMCE.getInstanceById('HP1B0Editor').remove();
$('.EditLink').show();
$(this).dialog('close');
}
}
}).parent();
dlg.appendTo(jQuery('form:first'));
},
error: function(data) {
$('.EditLink').show();
$('#HP1B0Editor').html('Error');
}
});
}
答案 0 :(得分：72)
要彻底删除编辑器实例并避免使用错误：
tinymce.EditorManager.execCommand('mceRemoveControl',true, editor_id);
要重新初始化实例，请使用：
tinymce.EditorManager.execCommand('mceAddControl',true, editor_id);
请注意，在DOM中移动TinyMCE编辑器时，您需要removeControl和addControl，否则会导致JS错误。
从 TinyMCE 4 开始，删除和重新初始化实例的方法现在......
要彻底删除编辑器实例并避免使用错误：
tinymce.EditorManager.execCommand('mceRemoveEditor',true, editor_id);
要重新初始化实例，请使用：
tinymce.EditorManager.execCommand('mceAddEditor',true, editor_id);
答案 1 :(得分：28)
晚会结束但可能会让人头疼。以下是4.2.4版本（2015-08-17）对我有用的内容：
tinymce.EditorManager.editors = [];
然后我可以在同一个动态创建的div上重新启动一个编辑器
tinymce.init({selector:"#text"});
答案 2 :(得分：15)
这对我有用：
if (typeof(tinyMCE) != "undefined") {
if (tinyMCE.activeEditor == null || tinyMCE.activeEditor.isHidden() != false) {
tinyMCE.editors=[]; // remove any existing references
}
}
答案 3 :(得分：12)
现在可以做到
tinymce.remove("#id .class or tag");
答案 4 :(得分：7)
如果您有更多具有不同设置的编辑器，这是重新保存设置的方法。
tinymce.EditorManager.editors.forEach(function(editor) {
// code injection
var old_global_settings = tinymce.settings;
tinymce.settings = editor.settings;
tinymce.EditorManager.execCommand('mceRemoveEditor', false, editor.id);
tinymce.EditorManager.execCommand('mceAddEditor', false, editor.id);
tinymce.settings = old_global_settings;
});
答案 5 :(得分：4)
确定。只是提醒一句。
如果你有，比如说...你要添加/删除tinymce实例的总共5个textareas。
AND
您希望在给定页面上多次执行此操作，然后最好为您的需求寻找替代解决方案。
为什么？..因为即使一切都运行正常，所有分离和重新连接的tinymce都需要多时间来执行。浏览器将提供为您停止脚本等。
来源：我自己的经验，我尝试将不同的textareas保存在单独的隐藏div中，并在需要时将其显示给用户。
答案 6 :(得分：3)
试试这个：
tinymce.remove();
setTimeout(function () {
tinymce.init(
{
selector: 'textarea',
menubar: false,
height: "300",
plugins: [
'advlist autolink lists link image charmap print preview anchor textcolor ksfm',
'searchreplace visualblocks code fullscreen',
'insertdatetime media table contextmenu paste code help'
],
toolbar: 'undo redo | fontselect fontsizeselect styleselect | alignleft aligncenter alignright alignjustify | bold italic underline strikethrough | link table | ksfm'
}
);
}, 1);
答案 7 :(得分：1)
如果您正在查看此内容以重置编辑器的内容，而不是销毁它并再次初始化它，您可以简单地更改此内容
var editor = tinymce.get('editor_id'); //the id of your textarea
editor.setContent(content); //any html as string
答案 8 :(得分：1)
删除现有的tinymce编辑器并添加tinymce.EditorManager.editors数组的新需求清除。此解决方案适用于以下两种情况：1。如果您只有一个编辑器，并且想要删除并再次添加它。 2.如果您有多个编辑器，并且想要删除某些特殊编辑器并再次添加它。
console.log(tinymce.EditorManager.editors);
这将为您提供要删除的所需编辑器的数组和精确索引的视图。例如，上述控制台的一个示例输出可以是：
Array[2]
0:B
1:B
length:2
textarea-1:B
textarea-2:B
_proto_Array[0]
当我在textareas上有两个tinymce编辑器时，这是控制台的输出：＃textarea-1和＃textarea-2假设我想删除＃textarea-2并重新添加它然后可以按如下方式完成：
tinymce.EditorManager.editors.splice(1, 1);//removing second element in array.
delete tinymce.EditorManager.editors['textarea-2'];//deleting respective textarea id from array
然后你可以使用init：
再次添加它tinymce.init({
selector:'#ts-textarea-2'
});
如果你只有一个与tinymce编辑器关联的textarea，请说：＃textarea-1，你想删除并重新初始化它然后你可以通过以下方式清空tinymce.EditorManager.editors：
tinymce.EditorManager.editors = [];
然后您可以使用init命令添加，如上所述。为我工作没有任何错误。
我希望它有所帮助
答案 9 :(得分：0)
上述所有解决方案对我来说都不起作用......这在我的弹出关闭事件中运作良好
var editor = tinyMCE.get('txtMailingText');
if (editor!=null) {
editor.destroy();
}
答案 10 :(得分：0)
为了它的价值，我最终做到了这一点：
这是添加编辑器的样子：
Reset current branch to here我有一个明显的点击删除了编辑器：
$(function() {
tinymce.EditorManager.execCommand('mceRemoveEditor',true, 'fred');
#{tinymce_javascript(:simple_editor, {height: 150, :selector => 'fred'})}
});
$(document).on('click', '.tinyMCE-save', function(event) {
tinyMCE.triggerSave();
return true;
});
答案 11 :(得分：0)
一开始我用过：
tinymce.execCommand('mceRemoveEditor', true, id);
tinymce.execCommand('mceAddEditor', true, id);
但这些命令是异步运行的，因此add命令通常会失败。作为一种解决方法，我会：
tinymce.execCommand('mceRemoveEditor', true, id);
setTimeout(function() {
tinymce.execCommand('mceAddEditor', true, id);
}, 500);
但是我讨厌这个解决方案，因为它对用户来说似乎很慢，即便如此，如果计算机速度很慢，你也无法确定500毫秒就足够了。
现在我正在使用：
tinymce.remove(id);
tinymce.init({
selector: id
});
我不确定为什么会这样，但它确实有效，而且这段代码没有我使用过的旧代码所带来的任何异步问题。
答案 12 :(得分：0)
// Remove all editors bound to divs
tinymce.remove('div');
// Remove all editors bound to textareas
tinymce.remove('textarea');
// Remove all editors
tinymce.remove();
// Remove specific instance by id
tinymce.remove('#id');
答案 13 :(得分：0)
Try this:
var default_value_1 = 'test';
var default_value_2 = 'test';
tinyMCE.remove();
tinyMCE.init({
selector: '#id_element_1',
plugins: 'print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount imagetools contextmenu colorpicker textpattern help code',
toolbar: "code formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat"
}).then(function(editors){
editors[0].setContent(default_value_1 || '');
});
tinyMCE.init({
selector: '#id_element_2',
plugins: 'print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount imagetools contextmenu colorpicker textpattern help code',
toolbar: "code formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat"
}).then(function(editors){
editors[0].setContent(default_value_2 || '');
});