完全删除 JQuery tinyMCE

Question

我已经像这样初始化 tinyMCE：

$('#text').tinymce({
    // Location of TinyMCE script, optional, already loaded in page.
    script_url : '../adminContent/js/tiny_mce/tiny_mce.js',

    // General options
    theme : "advanced",
    plugins : "table,advimage,advlink,iespell,inlinepopups,preview,contextmenu,paste,visualchars",

    // Theme options
    theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,forecolor,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,removeformat,cleanup,code,|,preview,tablecontrols,|,hr,visualaid,|,charmap,iespell",
    theme_advanced_buttons3 : "",

    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true
});

上面的代码完美运行。问题是当我尝试删除 tinyMCE 时。

我的删除代码是：

$('#text').tinymce().execCommand('mceRemoveControl', false, 'text');

我也试过了：

$('#text').remove();

和

$('#text').tinymce().remove();

第一个似乎没有做任何事情。最后两个给我这个错误：

Uncaught ReferenceError: t is not defined

虽然 HTML 文档加载了 tinymce，但我正在加载另一个脚本：

$.getScript(viewPath + '/mod/adminContent/js/editContent.js', function(){
    initEditContent(popup);
});

popup 是对加载 tinymce 的弹出窗口的引用。它只是一个使用 jquery 创建的 div。使用 jquery ajax 加载 div 的内容。

editContent.js 看起来像这样：

var contentID;
function initEditContent(popup){
    contentID = $('#contentID').val();

    tinyMCE.execCommand("mceAddControl", true, 'text');

    setTimeout(reposition, 50);
    setTimeout(reposition, 150);
    setTimeout(reposition, 250);

    // Submit form
    $('#editTextForm').ajaxForm(
    {
        // Before submit
        beforeSubmit: function(){
            //setPopupMessage(popup, '<div id="loading"><img src="../../img/loading.gif" />&nbsp;Please wait...</div>');
        },

        // Once submit completed
        success: function(responseText){
            tinyMCE.execCommand("mceRemoveControl", true, 'text');
            //closePopup(popup);

            // Update button with new data
            $('#' + contentID).html(responseText);
        }
    });
}

Answer 1

这似乎是 tinyMCE 自 3.5b3 版本以来的问题。它适用于 3.5b2 版本。

参见my fiddle 示例。

您会注意到它可以正常加载和卸载。但是把版本改成edge或者3.5b3，卸载的时候就会报错。

如tinyMCE bug site上所述：

问题描述：

第 13518 行出现 Javascript 错误。t 未定义。

复制步骤：

1. 调用 tinyMCE.execCommand('mceRemoveControl', false, idOfTextarea);

问题：

在 3.5b3 中，您将 t 重命名为 self，但没有在同一行中重命名 used 变量来获取文档。

解决方案：

将第 13518 行（在函数 hide() 中）更改为：var self = this, doc = self.getDoc();

Answer 2

问题解决了。对于那些感兴趣的人，我在 HTML 文档中加载了 tinyMCE，然后当我需要初始化它时，我做了：

tinyMCE.init({
    mode : "textareas",
    // General options
    theme : "advanced",
    plugins : "table,advimage,advlink,iespell,inlinepopups,preview,contextmenu,paste,visualchars",

    // Theme options
    theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,forecolor,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,removeformat,cleanup,code,|,preview,tablecontrols,|,hr,visualaid,|,charmap,iespell",
    theme_advanced_buttons3 : "",

    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,

    oninit: function(){
        alert('tinyMCE loaded');
    }
});

每次需要 tinyMCE 编辑器时都会调用上述代码。然后当我像这样关闭弹出窗口时将其删除：

tinyMCE.remove('text');

Answer 3

试试

$('#text').tinymce().execCommand('mceRemoveControl', true, 'text');

其中“文本”是您的编辑器的 ID

<textarea id='text' .....