javascript - How to set callback to execute after all the tinyMCE editors have been initialized?

admin管理员组

文章数量:1336660

I've loaded a tinyMCE editor using wp_editor function of Wordpress.

Now, I want to set value of that editor after it gets initialized. I tried to do it like this:

$(function() {
    tinymce.get(...).setContent(...);
});

But it throws an error saying Cannot read property 'setContent' of undefined because the editor has not been initialized. To confirm it I console logged using console.log( tinymce.editors.length ) statement and it prints 0 but later when I inspected the variable tinymce.editors using browser console after the loading was done, the editor was there and I could manipulate it.

So, my conclusion was to wait for all the tinyMCE editors to be initialized then run the above code to change the editor's value. Note that I need to set the value using JS, not from the backend (php).

EDIT: I'm loading the JS scripts using following statement:

add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) );

And inside the enqueue_scripts function:

wp_enqueue_script(..., ..., true);

Please tell me if there's a way to accomplish this. And ask me if you need more information or I'm unclear.

Thanks in advance :)

I've loaded a tinyMCE editor using wp_editor function of Wordpress.

Now, I want to set value of that editor after it gets initialized. I tried to do it like this:

$(function() {
    tinymce.get(...).setContent(...);
});

But it throws an error saying Cannot read property 'setContent' of undefined because the editor has not been initialized. To confirm it I console logged using console.log( tinymce.editors.length ) statement and it prints 0 but later when I inspected the variable tinymce.editors using browser console after the loading was done, the editor was there and I could manipulate it.

So, my conclusion was to wait for all the tinyMCE editors to be initialized then run the above code to change the editor's value. Note that I need to set the value using JS, not from the backend (php).

EDIT: I'm loading the JS scripts using following statement:

add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) );

And inside the enqueue_scripts function:

wp_enqueue_script(..., ..., true);

Please tell me if there's a way to accomplish this. And ask me if you need more information or I'm unclear.

Thanks in advance :)

• javascript
• jquery
• tinymce

Share Improve this question edited May 20, 2020 at 3:03 Krishna Suwal asked May 19, 2020 at 14:44 Krishna SuwalKrishna Suwal 1544 bronze badges 2

• Can you please edit your question to show us how you're loading the JavaScript? Specifically, are you using wp_enqueue_script() to do so? – Pat J Commented May 19, 2020 at 15:06
• @PatJ yes i'm using the wp_enqueue_script function to load the script. – Krishna Suwal Commented May 20, 2020 at 3:06

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You can wait for the specific editor manager to get added and then bind the init event handler to set content of the editor like this:

tinymce.on( 'addeditor', e => {
    if ( e.editor.id === <your_editor_id> ) {
        e.editor.on( 'init', event => {
            event.target.setContent( <your_editor_content> );
        });
    }
}, true );

本文标签： javascriptHow to set callback to execute after all the tinyMCE editors have been initialized