将tinymce应用于动态创建的textarea只工作一次

将tinymce应用于动态创建的textarea只工作一次,tinymce,tinymce-4,Tinymce,Tinymce 4,我有一个有三个水平标签的页面。单击选项卡会动态地用表单填充div。我正在使用BackboneJS管理视图的渲染(不确定是否相关)。当我在视图上调用render()时,在填充元素的html后,我调用将tinyMCE应用于文本区域: $('#text_' + this.model.id, this.$el).tinymce({ script_url : '/lib/tinymce/tinymce.min.js', theme : "mo

我有一个有三个水平标签的页面。单击选项卡会动态地用表单填充div。我正在使用BackboneJS管理视图的渲染(不确定是否相关)。当我在视图上调用render()时,在填充元素的html后,我调用将tinyMCE应用于文本区域:

$('#text_' + this.model.id, this.$el).tinymce({
                script_url : '/lib/tinymce/tinymce.min.js',
                theme : "modern",
                content_css: "/css/bootstrap.min.css",
                menubar: false,
                toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | " +
                    "bullist numlist outdent indent | link image |  forecolor backcolor emoticons",

                setup: function(editor) {
                    editor.on('change', function(e) {
                        var change = {};
                        change["content"] = e.level.content;
                        self.model.set(change);

                    });
                }
            });

这在第一次使用时效果非常好。删除视图时,会有一个名为的事件应用于
.tinymce().remove()添加到”字段以正确删除编辑器。下一个视图渲染-它是相同的视图,但不同的模型。在这个调用和所有后续调用中,tinyMCE隐藏textarea,不显示编辑器。我知道我的视图是有效的——在render()中调用tinymce()可以使一切按预期工作。蒂尼姆斯在某处跌跌撞撞。任何洞察都将不胜感激。

我对
.tinymce().remove()的内容不是100%清楚正在执行,但您是否尝试过此操作:

tinymce.triggerSave();
tinymce.execCommand('mceRemoveEditor', true, tinymce.activeEditor.id);
切换到下一个视图时,请尝试通过以下方式重新连接编辑器:

tinymce.execCommand('mceAddEditor', false, selector);
如果这不起作用或者不适用于你正在做的事情。您是否考虑过拥有一个以上的tinyMCE编辑器?听起来您有一组选项卡,因此您可以为每个选项卡创建一个单独的tinyMCE,并根据需要使用以下工具在每个选项卡上隐藏/显示编辑器:

tinymce.execCommand('mceToggleEditor', false, selector);
这种方法被认为比添加/删除编辑器快得多