Javascript 删除TinyMCE控件并重新添加
我有一个从不重新加载页面的js应用程序,所以在导航时我需要完全删除TinyMCE控件,然后在导航到需要它的区域时,我想重新初始化。我试着用公认的答案回答这个问题,但似乎没用 我的具体建议是:Javascript 删除TinyMCE控件并重新添加,javascript,html,tinymce,state,Javascript,Html,Tinymce,State,我有一个从不重新加载页面的js应用程序,所以在导航时我需要完全删除TinyMCE控件,然后在导航到需要它的区域时,我想重新初始化。我试着用公认的答案回答这个问题,但似乎没用 我的具体建议是: //if I throw an alert here, it does get called, so I know it's not null if (tinyMCE.getInstanceById("main-text")) tinyMCE.EditorManager.e
//if I throw an alert here, it does get called, so I know it's not null
if (tinyMCE.getInstanceById("main-text"))
tinyMCE.EditorManager.execCommand('mceRemoveControl', true, "main-text");
我也试过了
tinyMCE.remove( tinyMCE.getInstanceById("main-text"));
// AND
tinyMCE.remove( "main-text");
我知道当我把一个警报放在条件。。。我知道这是正确的ID——API中是否还有我遗漏的其他东西?这不是jQuery版本。在尝试删除之后,编辑器仍然存在,如果我通过导航回表单的状态重新初始化它,我甚至会得到一个具有相同ID的新编辑器
编辑:以下解决方案在当前版本3.5b3中不起作用,仅在3.4.9中起作用。有一个bug,其中“t未定义”
以防万一,这是初始化之后DOM的相关部分
<textarea id="main-text" style="display: none;" aria-hidden="true"></textarea>
<span id="main-text_parent" class="mceEditor defaultSkin" role="application" aria-labelledby="main-text_voice" style="display: inherit;">
<span id="main-text_voice" class="mceVoiceLabel" style="display:none;">Rich Text Area</span>
<table id="main-text_tbl" class="mceLayout" cellspacing="0" cellpadding="0" role="presentation" style="width: 100%; height: 400px;">
<tbody>
<tr class="mceFirst" role="presentation">
<td class="mceToolbar mceLeft mceFirst mceLast" role="presentation">
<div id="main-text_toolbargroup" aria-labelledby="main-text_toolbargroup_voice" role="group" tabindex="-1">
<span role="application">
</div>
<a onfocus="tinyMCE.getInstanceById('main-text').focus();" title="Jump to tool buttons - Alt+Q, Jump to editor - Alt-Z, Jump to element path - Alt-X" accesskey="z" href="#"></a>
</td>
</tr>
<tr>
<tr class="mceLast">
</tbody>
</table>
</span>
富文本区
我已经遇到过几次了。为了解决这个问题,我确保tinyMCe控件没有焦点(在某些浏览器中会导致一些错误),删除tinyMCe控件,并删除与该控件关联的文本区域
以下是相关代码:
if (typeof tinyMCE != 'undefined') {
tinyMCE.execCommand('mceFocus', false, 'main-text');
tinyMCE.execCommand('mceRemoveControl', false, 'main-text');
var container = document.getElementById('main-text-parent');
container.removeChild(document.getElementById('main-text'));
//i normally just do $("#main-text").remove(); but you specified not using jquery, so this should, in theory, remove it, if main-text-parent is replaced with the parent container of your main-text.
}
任何一个看到这个帖子的人。现在tinymce 4.X只需调用remove函数,就可以删除一个或多个编辑器表单页面
execCommand函数将执行哪些命令的文档在哪里?手册只说第一个参数是“要执行的命令”,手册中没有“MCEREMOVERCONTROL”的参考,这部分介绍了MCEREMOVERCONTROL:
if (typeof tinyMCE != 'undefined') {
tinyMCE.execCommand('mceFocus', false, 'main-text');
tinyMCE.execCommand('mceRemoveControl', false, 'main-text');
var container = document.getElementById('main-text-parent');
container.removeChild(document.getElementById('main-text'));
//i normally just do $("#main-text").remove(); but you specified not using jquery, so this should, in theory, remove it, if main-text-parent is replaced with the parent container of your main-text.
}
// 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');