当我单击工具栏上的任何内容时，TinyMce 会重新加载

Question

问题是每次我单击工具栏上的任何内容时，tinyMCE（v 4.7.12）编辑器都会重新加载。这仅在一次回发后发生。在第一次初始化时，编辑器工作正常，但之后它的行为如下。如果我刷新页面，编辑器又可以正常工作了。

这是初始化代码：

$(document).ready(function () {

        $('#<%=_questionText.ClientID%>').tinymce({
            setup: function (editor) {
                editor.on('init', function (e) {
                    $('#' + e.target.id + '_ifr').removeAttr('title');
                });
            },
            // Location of TinyMCE script
            script_url: '<%=ResolveUrl("~/tinymce_4.7.12/tinymce.min.js")%>',
               height: 246,
               //cleanup_on_startup:true,
               remove_redundant_brs: true,
               forced_root_block: false,
               branding: false,
               width: 1035,
               relative_urls: false,
               remove_script_host: false,
               // Drop lists for link/image/media/template dialogs
               //template_external_list_url: 'lists/template_list.js',
               external_link_list_url: '<%=ResolveUrl("~/ContentList.aspx?contentType=documents")%>',
               external_image_list_url: '<%=ResolveUrl("~/ContentList.aspx?contentType=images")%>',
                media_external_list_url: '<%=ResolveUrl("~/ContentList.aspx?contentType=video")%>',
                plugins: [
                    "image charmap textcolor code upload advlist link <%= (IsHorizontalRuleEnabled? "hr" : "") %> table paste lists"
                ],
                toolbar1: "bold italic underline strikethrough superscript subscript | bullist numlist indent outdent link | <%= (IsHorizontalRuleEnabled? "hr" : "") %> image upload table | charmap code | forecolor backcolor  | styleselect fontselect fontsizeselect ",
                table_default_attributes: {
                    cellpadding: '5px'
                },
                table_default_styles: {
                    width: '50%'
                },
                paste_as_text: true,
                menubar: false,
               init_instance_callback: "tinyMCEInitialized_<%=ClientID%>",
               default_link_target: "_blank",
               //Cause contents to be written back to base textbox on change
               onchange_callback: function (ed) { ed.save(); },
               gecko_spellcheck: true,
               fontsize_formats: "8px 10px 12px 14px 16px 18px 20px 24px 36px"
           });

        //fix for incorrect user input html
        var ok = $('a[id$=_okBtn]');
        ok.attr('data-href', ok.attr('href'));
        ok.removeAttr('href');
        ok.attr('onclick', 'okButtonClick()');
    });

我尝试删除一些工具仍然如此

我预计尽管发生了回发，但该编辑器功能仍能正常工作。

Answer 1

查看您的代码，其中

setup

是。

它似乎是由刚刚存在的

$('#<%=_questionText.ClientID%>')

触发的。 JQuery 很可能将其解释为“单击菜单项时，设置 TinyMCE。”

我认为你想要的是在单击某个特定项目时设置tinymce。

因此，您需要弄清楚为什么

$('#<%=_questionText.ClientID%>')

针对您的所有菜单项，并使其仅针对您想要的特定菜单项。

然后您可能希望从该菜单项中删除设置，以便后续单击不会重新设置 TinyMCE。

所以你应该这样做：

$('#tinyMceMenuItem').on('click',()=> setupTinyMCE())

function setupTinyMCE(){

  // setup TinyMCE
  $('#tinyMceMenuItem').tinymce(...)
  
  // Remove the click event so the user doesn't accidentally run the setup again
  $('#tinyMceMenuItem').off('click')
}