tinyMCE 获取编辑器返回 null

Question

我在 2 个具有不同 id 的 textarea 上初始化了 2 tinyMCE 编辑器：

var variable_array = {id:'cName', test:'mon test'};
tinymce.init({
    selector: "#model_editor",
    entity_encoding : "raw",
    encoding: "UTF-8",
    theme: "modern",
    height: "500px",
    width: "100%",
    variables_list : variable_array,
    plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste textcolor colorpicker textpattern modelinsert"
    ],
    toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image print preview media | forecolor backcolor emoticons",
    toolbar2: "variable_insert | question_insert",
    image_advtab: true,
    templates: [
        {title: 'Test template 1', content: 'Test 1'},
        {title: 'Test template 2', content: 'Test 2'}
    ]
});

tinymce.init({
    selector: "#headerfooter_editor",
    entity_encoding : "raw",
    encoding: "UTF-8",
    theme: "modern",
    height: "500px",
    width: "100%",
    variables_list : variable_array,
    plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste textcolor colorpicker textpattern modelinsert"
    ],
    toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image print preview media | forecolor backcolor emoticons",
    toolbar2: "variable_insert | question_insert",
    image_advtab: true,
    init_instance_callback : "mceInitInstance",
    templates: [
        {title: 'Test template 1', content: 'Test 1'},
        {title: 'Test template 2', content: 'Test 2'}
    ]
});

两个编辑器都正确初始化。 然后为了在每个上设置不同的内容，我尝试获取编辑器实例对象 id ：

var editor_id = tinyMCE.get('#headerfooter_editor');
console.log(editor_id);

它返回空：/

我还尝试在控制台中获取第二个 init 回调的结果：

function mceInitInstance(inst) {

console.log("Editor: " + inst.editorId + " is now initialized.");

它返回：编辑器：未定义现在已初始化。

我想做以下事情：

tinyMCE.get('#headerfooter_editor').setContent(data.content);

但当然它会返回一个错误：未捕获的类型错误：无法读取 null 的属性“setContent”

我不明白出了什么问题以及为什么我无法获得编辑器实例 ID：/

Answer 1

您的编辑器应该可以使用tinymce.get('model_editor')和tinymce.get('headerfooter_editor') 。

提示： tinymce.editors保存所有已初始化的编辑器实例。 您可以遍历该数组以获取全部：

for (var i = 0; i < tinymce.editors.length; i++)
{
    console.log("Editor id:", tinymce.editors[i].id);
}        

Answer 2

代替：

tinyMCE.get('#headerfooter_editor').setContent(data.content);

用

tinyMCE.get('headerfooter_editor').setContent(data.content);

删除#

Answer 3

我遇到了同样的问题。 错误消息是：

TypeError: tinymce.get(...) is null

但我的错误是我在启动 tinymce 编辑器之前尝试了tinymce.get(...) 。

tinymce.init({selector: "#mytextarea"})