代码之家  ›  专栏  ›  技术社区  ›  user254875486 TM Creative

将Tinymce编辑器动态添加到文本区域会杀死其他实例

  •  2
  • user254875486 TM Creative  · 技术社区  · 15 年前

    我有一个包含一个或多个文本区域的HTML页面,每个文本区域都有一个Tinymce编辑器(通过使用 tinyMCE.init({mode : "textareas", etc...}); . 一开始他们都按自己的意愿工作,没有问题。页面上还有一个按钮,用于向页面添加新的文本区域(使用Ajax)。在Ajax调用的处理程序中,我将responseText附加到页面上的某个DIV。之后,我尝试使用

    tinyMCE.execCommand("mceAddControl", false, "text" + cnt);
    

    在哪里? cnt 是某种偏移量, "text" + cnt 对于每个文本字段都是唯一的。

    这很好地工作,除了在新编辑器到达之前页面上的所有tinymce编辑器现在都是空白的,不响应任何输入(也不键入或单击任何按钮)。如果我在页面中添加另一个文本区域,其中一个将有一个工作编辑器,前一个也将被杀死。

    我尝试通过使用将tinymce单独添加到初始文本区域 tinyMCE.init({mode : "none", etc...}); 对于每个文本区域调用 tinyMCE.execCommand("mceAddControl", false, "text" + cnt); . 但结果是一样的。

    我也试过这么做 tinyMCE.init({...}) 同样,对于每个新的文本区域,这会产生相同的结果。

    请帮帮我,我越来越沮丧和绝望…

    5 回复  |  直到 7 年前
        1
  •  2
  •   user254875486 TM Creative    15 年前

    我知道问题出在哪里。我将生成inputfields的Ajax调用的responseText附加到已经保存了其他inputfields的DIV中。这就是问题所在。现在,我创建了一个新的DIV,在其中放置新的输入字段(所以每个具有tinymce编辑器的文本区域都在自己的DIV中)。这解决了我的问题。

        2
  •  2
  •   Josh Crews    12 年前

    我也遇到了这个问题,解决了什么问题:

    动态添加每个新的文本区域时,需要 mceAddControl 添加到屏幕后添加到它。所以在为Tinymce添加新文本区域的同一个JS中,我运行

    $('.tinymce').each(function(){
        tinyMCE.execCommand('mceAddControl',false,$(this).attr('id'))
      });
    

    在哪里? tinymce 是我的Tinymce文本区的类吗?

        3
  •  0
  •   Christopher Tokar    15 年前

    我记得我曾经有过类似的问题… this thread 应该帮助

        4
  •  0
  •   user888132    7 年前

    我正面临着这个问题,我为此损失了很多时间和时间,而这个Rael_的孩子找到了他的答案,我将为其他面临这个问题的人添加我的答案。

    正在添加我的动态内容

    currentDiv.innerHtml += newContent;
    

    这将重新绘制所有的innerhtml,然后这些innerhtml似乎会破坏现有的tinymce编辑器。为了防止发生这种情况,您需要使用insertadjacenthl,如下所示:

    currentDiv.insertAdjacentHTML('beforeend', newContent);
    

    希望这能节省我失去的时间!

        5
  •  -2
  •   Nicolas R    10 年前

    在后面粘贴整个初始化代码 $(wrapper).append('write your fields row div or tr code here'); //工作正常:)

    tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
            editor_selector : "mceEditor",
            editor_deselector : "mceNoEditor",  
        theme_advanced_buttons1 : "code,bold,italic,underline,image,separator,strikethrough,justifyleft,justifycenter,justifyright, justifyfull,bullist,numlist,undo,redo,link,unlink,|,tiny_mce_wiris_formulaEditor,tiny_mce_wiris_CAS,|,fullscreen,jbimages",
        theme_advanced_buttons2 : "",
        theme_advanced_buttons3 : "",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        plugins : 'inlinepopups,tiny_mce_wiris,jbimages',
        setup : function(ed) {
            // Add a custom button
            ed.addButton('mybutton', {
                title : 'My button',
                image : 'img/example.gif',
                onclick : function() {
                    // Add you own code to execute something on click
                    ed.focus();
                    ed.selection.setContent('Hello world!');
                }
            });
        }
    });