tinymce编辑器getContent在Wordpress中为null

Question

I am trying to use the getContent feature of the Tinymce editor in WordPress admin area but to no avail.

Here is a working pen of what I want to do

https://codepen.io/anon/pen/oWxjyM?editors=1111

HTML

<textarea class="wp-editor-area" rows="20" autocomplete="off" cols="40" name="wprss_ftp_post_prepend" id="wprsspostprepend">&lt;p&gt;To give is good&lt;/p&gt;</textarea>

JS

jQuery(document).ready(function() {
  $("#wprsspostprepend").addClass("prepend_editor");
var name = "wprsspostprepend";
if($("#" + name).length > 0) {

  tinyMCE.init({
        mode : "specific_textareas",
        editor_selector : "prepend_editor"  
});
   var content =  tinyMCE.activeEditor.getContent();
  alert(content);
    tinyMCE.activeEditor.setContent("<div id='random-wrap'>" + content + "</div>");
}
 });

Why am I getting the null reference error in Wordpress if it works in codepen.

Answer 1

The issue here is likely that the init() method is asynchronous. You appear to be trying to use the tinymce object (eg tinymce.activeEditor ) immediately after calling init() but the initialization process is likely not complete yet so you have no "active" editor on the page.

If you want to interact with the editor "as soon as its available" you can use an onInit trigger in your TinyMCE init() call. For example:

tinymce.init({
  selector: '#myTextArea",
  setup: function (editor) {
    editor.on('init', function () {
      this.setContent('<p>Add content via on init!</p>');
    });
  }
});