动态添加TinyMCE编辑器到textarea会杀死其他实例

Question

我有一个带有一个或多个textareas的html页面，每个都有一个TinyMCE编辑器（使用tinyMCE.init({mode : "textareas", etc...});添加到它们。首先它们都可以正常工作，没有问题。页面上是还有一个向页面添加新textarea的按钮（使用AJAX）。在AJAX调用的处理程序中，我将responsetext附加到页面上的某个div。之后我尝试使用

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

其中cnt是某种偏移量，"text" + cnt对于每个文本字段都是唯一的。

这样可以正常工作，除了在新页面到达之前页面上的所有TinyMCE编辑器现在都是空白的并且不响应任何输入（也不是键入或点击任何按钮）。如果我将另一个textarea添加到页面中，那么将有一个工作编辑器，前一个也会被杀死。

我尝试使用tinyMCE.init({mode : "none", etc...});和每个调用tinyMCE.execCommand("mceAddControl", false, "text" + cnt);的textarea将TinyMCE单独添加到初始textareas中。但结果是一样的。

我还尝试为每个新的textarea再次执行tinyMCE.init({...})，但这会产生相同的结果。

请帮助我，我越来越沮丧和绝望......

Answer 1

我知道问题是什么。我附加了AJAX调用的responseText，它生成了已经保存其他输入字段的div的输入字段。那就是问题所在。我现在创建一个新的div，我在其中放置新的输入字段（因此每个textarea都有一个tinyMCE编辑器在他自己的div中）。这解决了我的问题。

Answer 2

我也有这个问题，对我来说有什么问题：

动态添加每个新文本区域后，添加到屏幕后需要添加mceAddControl。因此，在附加新文本区域的相同js中，我运行

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

其中tinymce是我的tinymce textarea的类

Answer 3

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

Answer 4

我遇到了这个确切的问题而且我已经失去了几个小时和几个小时，而rael_kid找到了他的答案，我将为其他任何面临此问题的人添加我的答案。

我的动态内容正在添加

currentDiv.innerHtml += newContent;

这重绘了所有的innerhtml，这似乎打破了现有的tinymce编辑器。为防止这种情况发生，您需要使用insertAdjacentHTML，如下所示：

currentDiv.insertAdjacentHTML('beforeend', newContent);

希望这可以节省其他人丢失的时间！

Answer 5

已解决：

当您通过jquery添加新的textarea时，可以调用波纹管功能。

addTinyMCE();

function addTinyMCE(){
  // Initialize
  tinymce.init({
    selector : "textarea",
}

Answer 6

在$(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!');
            }
        });
    }
});