我如何删除tinyMCE，然后重新添加它？ [英] How do i remove tinyMCE and then re-add it?
问题描述
我试图将tinyMCE编辑器添加到我的页面中，将其删除，然后再次添加，但出现错误。
当我运行Part A时， B部分，再次比A部分我得到的错误：
错误：g.win.document为空
来源部分A
$ b js + =tinyMCE.init（{;
js + =''mode'：'exact'，\\\
;
js + =''elements'：'+ ctrl.ID +Editor'，\\\
;
js + =''plugins'：'insertdatetime，TVCMSLink，TVCMSImage'，\\\
;
js + =''theme'：'advanced'，\\\
;
js + =''theme_advanced_layout_manager'：'SimpleLayout'，\\\
;
js + = 'theme_advanced_buttons1'：'backcolor，forecolor，|，粗体，下划线，删除线，|，numlist，bulli st，charmap，|，undo，redo，|，anchor，link，tvlink，unlink'，\\\
;
js + =''theme_advanced_buttons2'：''，\\\
;
js + ='theme_advanced_buttons3'：''\\\
;
js + =}）; \\\
;
部分B
js + =tinyMCE.getInstanceById（'+ ctrl.ID +Editor'）。remove（）; \\\
;
编辑：
以上是创建JavaScript ...的后端尖端是完整的JavaScript函数。第一次通过它打开对话框并运行，内容在编辑器中，没有错误。当我点击关闭按钮时，对话框关闭。当我再次运行该函数时，会显示对话框，但编辑器为空，并且出现上述错误。
function show_HP1B0（） {
$（'。EditLink'）。hide（）;
$ .ajax（{
type：'post'，
url：'genericHandler.ashx'，
data：'cmd = select& tableName = ExtraBlocks& id = 4' ，
dataType：'json'，
成功：函数（数据）{
$（'＃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 ，| |，粗体，下划线，删除线，|，numlist，bullist，charmap，|，撤销，重做，|，锚点，链接，tvlink，取消链接'，
'theme_advanced_buttons2'：''，
'theme_advanced_buttons3'：''
}）;
var dlg = $ （'＃ctl00_EXTRA_HTML_0_HP1B0Editor'）。dialog（{
modal：false，
draggable：false，
position：'center'，
zIndex：99999，// Overlay
width：370，
title：'Content Block Editor'，
closeText：''，
open：function（）{
$（'body'）。css （'溢出'，'隐藏'）;
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'）;
}，
'取消'：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'）;
}
}）;
解决方案并避免任何错误使用：
tinymce.EditorManager.execCommand（'mceRemoveControl'，true，editor_id）;
重新初始化实例使用：
tinymce.EditorManager.execCommand（'mceAddControl'，true，editor_id）;
请注意，在DOM中移动TinyMCE编辑器时，您需要 removeControl 和 addControl ，否则会导致JS错误。
从 TinyMCE 4 中，删除和重新初始化实例的方法现在是...
要干净地删除编辑器实例并避免任何错误使用：
tinymce.EditorManager.exeCommand（'mceRemoveEditor'，true，editor_id）;
重新初始化实例使用：
tinymce.EditorManager.execCommand（'mceAddEditor'，true，editor_id）;
I'm trying to add the tinyMCE editor to my page, remove it, then add it again but am getting errors.
When I run Part A, then Part B, Than Part A again I get the error:
Error: g.win.document is null
Source File: tiny_mce/tiny_mce.js Line: 1
Part 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";
Part B
js += " tinyMCE.getInstanceById('" + ctrl.ID + "Editor').remove();\n";
Edit:
The above is the backend spinets that create the JavaScript... below is the full JavaScript function. The first time through it opens the dialog and works, the contents is in the editor and there is no error. When I click the close button, the dialog is closed. When I run the function again, the dialog displays but the editor is empty and there is the above error.
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');
}
});
}
解决方案 To cleanly remove an editor instance and avoid any errors use:
tinymce.EditorManager.execCommand('mceRemoveControl',true, editor_id);
To reinitialize the instance use:
tinymce.EditorManager.execCommand('mceAddControl',true, editor_id);
Be aware that when moving TinyMCE editors in the DOM you need to removeControl and addControl too, otherwise it results in JS errors.
As of TinyMCE 4 the methods to remove and reinitialize an instance are now...
To cleanly remove an editor instance and avoid any errors use:
tinymce.EditorManager.execCommand('mceRemoveEditor',true, editor_id);
To reinitialize the instance use:
tinymce.EditorManager.execCommand('mceAddEditor',true, editor_id);
这篇关于我如何删除tinyMCE，然后重新添加它？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
