Как получить входные данные редактора TinyMCE при использовании на интерфейсе?

Это код, который я добавил в свой javascript прямо перед отправкой формы.

// Find and loop through all TinyMCE editors.
jQuery('#the-form').find( '.wp-editor-area' ).each(function() {
    var id = jQuery( this ).attr( 'id' ),
        sel = '#wp-' + id + '-wrap',
        container = jQuery( sel ),
        editor = tinyMCE.get( id );

    // If the editor is in "visual" mode then we need to do something.
    if ( editor && container.hasClass( 'tmce-active' ) ) {
        // Saves the contents from a editor out to the textarea:
        editor.save();
    }
});

Это сработало для меня:

if (jQuery("#wp-description-wrap").hasClass("tmce-active")){
    description1 = tinyMCE.activeEditor.getContent( { format : 'html' } );
}else{
    description1 = jQuery('[name="description"]').val();

Где описание - идентификатор редактора tinymce и код de после еще принятого ответа, для меня не сработало.

Мне потребовалось намного больше кода, чтобы заставить его работать, а также я получал ошибку javascript: Deprecated TinyMCE API call: <target>.onKeyUp.add(..) Это было вызвано обновлением wordpress с 3.x до 4. Так что мне пришлось clear my browser cache сначала.

Во-первых, я добавил обратный вызов в фильтр wp tiny_mce_before_init в моем functions.php файл, это позволило мне добавить функцию обратного вызова js, которая будет запущена при инициализации редакторов:

add_filter( 'tiny_mce_before_init', array( $obj, 'filter_cb_mce_before_init' ) );

/**
 * Filter cb to add event listeners to tinymce editor.
 * @param  array $init An array of setup js functions as strings.
 * @return array       Returns new array of js function strings.
 */
function filter_cb_mce_before_init( array $init ) {
        $init['setup'] = "function(ed){
                if(get_tinymce_content)  //not required, I use it as flag to check if on correct page
                    ed.on('change', function(){ get_tinymce_content() });
            }";
        return $init;
    }

Далее функция javascript, чтобы делать все, что требуется, с содержимым, когда оно меняется. Добавьте этот javascript с помощью wp_enqueue_scripts на нужную страницу.

  /**
   * Get the content of the tinyMCE editor.
   * @link http://wordpress.stackexchange.com/questions/42652/how-to-get-the-input-of-a-tinymce-editor-when-using-on-the-front-end
   * @return {string} Returns the content
   */
  function get_tinymce_content(){

    //change to name of editor set in wp_editor()
    var editorID = 'my_editor_id';

    if (jQuery('#wp-'+editorID+'-wrap').hasClass("tmce-active"))
        var content = tinyMCE.get(editorID).getContent({format : 'raw'});
    else
        var content = jQuery('#'+editorID).val();

    console.log(content);
}

Код работал, когда я использовал следующее для печати редактора на любой странице:

<?php wp_editor( @$event->description, 'my_editor_id', array(
    'media_buttons' => false,
    'textarea_name' => 'data[description]',
    'quicktags'     => array("buttons"=>"link,img,close"),
) ); ?>

Вы можете получить содержимое в зависимости от текущего режима редактора.

function get_tinymce_content()
    {
    if (jQuery(".switch-tmce").css('background-color')=='rgb(245, 245, 245)')
        return tinyMCE.activeEditor.getContent();
    else
        return jQuery('#html_text_area_id').val();
    }

Вкладка Визуальная имеет класс switch-tmce, который вы можете использовать для идентификации ее как вкладки. Вы бы знали, что он был сфокусирован, если бы у него был более светлый цвет фона. Таким образом, вы также можете использовать это, чтобы определить, какая из двух вкладок активна.

Это адаптивное решение, основанное на Bainternetответе . Вероятно, есть и другие лучшие способы сделать это, но это один из них хорошо сработал для меня.

Вы также можете использовать addeditor событие:

  /// Fires when an editor is added to the EditorManager collection.
  tinymce.on('addeditor', function( event ) {
    var editor = event.editor;
    var $textarea = $('#' + editor.id);
    console.log($textarea.val());
  }, true );

Документация по событию TinyMCE 'addeditor'