Получение содержимого WP Tinymce
Я пытаюсь написать плагин Wordpress. Я получу счетные слова, которые в редакторе WP Tinymce.
В принципе, это счетчик слов, который отсчитывает длительность вашего сообщения и дает вам это сообщение в мета-поле
Ваше сообщение имеет 450 слов
Моя простая проблема заключается в получении слов от Tinymce через javascript. Это не работает:
document.getElementById('content')
Идентификатор содержимого Tinymce является содержимым. Но этот код возвращает NULL. Я не смог найти правильное имя для Tinymce.
Вскоре все остальные коды готовы, просто я не могу получить слова из редактора Wordpress WYSIWYG.
Спасибо.
Ответы
Ответ 1
Try:
tinymce.activeEditor.getContent();
или
tinymce.editors.content.getContent();
Если "content" - это идентификатор вашего текстового поля.
Аналогично, если вы хотите получить только выделенный (выделенный) текст в текстовой области TinyMCE, вы бы сделали:
tinymce.activeEditor.selection.getContent();
Полный API находится здесь: http://tinymce.moxiecode.com/wiki.php/API3:class.tinymce.Editor
TinyMCE также предлагает множество событий, к которым вы можете привязать, особенно в вашем случае keyup, keydown и нажатие.
Обязательно вызывайте этот материал только после загрузки TinyMCE на странице.
Ответ 2
Я помню, что крошечный MCE загружает контент динамически из ajax, поэтому, возможно, ваш document.getElementById('content')
попытается получить этот элемент слишком рано.
Я думаю, у вас есть 2 способа решить эту проблему:
1) дождитесь завершения события ajax с помощью прослушивателя событий и после этого получите элемент и его текст.
2) используйте функцию tinyMce для получения содержимого текстовой области. Здесь вы можете найти полезные советы:
http://tinymce.moxiecode.com/wiki.php/How-to_load/save_with_Ajax_in_TinyMCE
Ответ 3
Принятый ответ действительно работал у меня, но для нескольких редакторов на одной странице мне нужно получить к нему доступ через идентификатор редактора, поэтому ниже
tinymce.editors['content_id'].getContent();
Работал для меня.
Ответ 4
Вот пример. Текст, находящийся ниже редактора, будет обновлен, если ключевое слово произошло в режиме Visual или HTML.
![WP tinyMCE onKeyUp]()
Событие Visual Mode в файле php:
function my_tiny_mce_before_init( $init ) {
$init['setup'] = "function( ed ) { ed.onKeyUp.add( function( ed, e ) { repeater( e ); }); }";
return $init;
}
add_filter( 'tiny_mce_before_init', 'my_tiny_mce_before_init' );
Событие HTML в файле javascript:
jQuery( document ).ready( function( $ ) {
$('<div id=look-at-it></div>').insertAfter('#postbox-container-1');
$('#content').on('keyup', function( e ) {
repeater( e );
});
});
var repeater = function ( e ) {
var targetId = e.target.id;
var text = '';
switch ( targetId ) {
case 'content':
text = jQuery('#content').val();
break;
case 'tinymce':
if ( tinymce.activeEditor )
text = tinymce.activeEditor.getContent();
break;
}
jQuery('#look-at-it').html( text );
}
Протестировано:
Ответ 5
Это сработало для меня:
if (jQuery("#wp-text-wrap").hasClass("tmce-active")){
text1 = tinyMCE.activeEditor.getContent( { format : 'html' } );
}else{
text1 = jQuery('[name="text"]').val();
Где текст - это идентификатор редактора tinymce
Ответ 6
Это тот, который, кажется, работает для меня в каждой ситуации, которую я тестировал. Независимо от того, начинаем ли мы с текстового режима или в визуальном режиме и независимо от изменения режимов и добавления дополнительного контента после этого.
if ( tinyMCE.editors['id-of-your-editor'] ) {
tinyMCE.editors['id-of-your-editor'].save();
tinyMCE.editors['id-of-your-editor'].load();
var your_content = tinyMCE.editors['id-of-your-editor'].getContent();
} else if ( document.getElementById( 'id-of-your-editor' ) ) {
var your_content = document.getElementById( 'id-of-your-editor' ).value;
} else {
alert ( 'Error' );
}