tinyMCE get编辑器返回null [英] tinyMCE get editor returns null

问题描述

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

I initialize 2 tinyMCE editor on 2 textarea with different id :

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:

Both editors init correctly. Then in order to set different content on each, I try to get the editor instance object id :

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

它返回null:/

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

I try also to get in the console the result of the callback of the second init :

function mceInitInstance(inst) {

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

它返回:编辑器:未定义现在已初始化.

And it returns : Editor: undefined is now initialized.

我要执行以下操作:

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

但是它当然会返回错误:未捕获的TypeError:无法读取null的属性'setContent'

but of course it returns an error : Uncaught TypeError: Cannot read property 'setContent' of null

我不明白这是什么问题，为什么我无法获得编辑器实例ID:/

I don't understand what's wrong and why I can't get the editor instance id :/

推荐答案

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

Your editors should be available using tinymce.get('model_editor') and tinymce.get('headerfooter_editor').

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

Hint: tinymce.editors holds all editor instances that have been initialized. You can loop through that array to get them all:

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

这篇关于tinyMCE get编辑器返回null的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！