获取WP Tinymce的内容

我想写一个Wordpress插件。我会在WP的Tinymce编辑器中看到数字。基本上，这是该计算您的文章长，给你这个消息在元框获取WP Tinymce的内容

您的文章一个字计数器有450个字

我刚才的问题是从TinyMCE的通过JavaScript得到的话。这是行不通的：

document.getElementById('content')

TinyMCE的内容的ID是内容。但是这个代码返回NULL。我找不到Tinymce的有效id名称。

简而言之，其他所有代码都准备好了，只是我无法从Wordpress的所见即所得编辑器获取单词。

谢谢。

来源

2011-04-22 Eray

尝试：

tinymce.activeEditor.getContent();

或

tinymce.editors.content.getContent();

其中， “内容” 是你的textarea的ID。

同样，如果你想要得到的只是所选择的（高亮显示）在TinyMCE的文本区域的文字，你会怎么做：

tinymce.activeEditor.selection.getContent();

完整的API是在这里：http://tinymce.moxiecode.com/wiki.php/API3:class.tinymce.Editor

TinyMCE的同时也提供了很多您可以绑定的事件，特别是在您的案例中，keyup,keydown和keypressed事件。

一定要在TinyMCE加载到页面上之后调用这个东西。

来源

2011-04-30 18:54:38

工作完美！我不敢相信这很简单。 – 2012-01-21 04:09:45

正如他在下面的答案中提到的那样，这些解决方案不适用于所有定制编辑 - 尤其是如果您在ID中使用连字符。虽然这不是一个简单的问题，只是JavaScript的工作方式，它可能会给你一些麻烦。 Savitas的答案是使用“编辑器”作为数组，而不是：'tinymce.editors ['content_id']。getContent（）;' – 2013-09-06 18:50:34

我记得微小的MCE从ajax动态地加载内容，所以也许你的document.getElementById('content')试图让那个元素太早。

我认为你有2种方法来解决这个问题：

1）等待AJAX事件completition，使用事件侦听器，之后获得元素和它的文本。

2）使用tinyMce函数获取文本区域的内容。在这里，你可能会发现一些有用的提示： http://tinymce.moxiecode.com/wiki.php/How-to_load/save_with_Ajax_in_TinyMCE

来源

2011-04-22 23:08:43

谢谢曼努埃尔，现在我试试吧:) – Eray 2011-04-30 16:24:50

接受的答案没有工作对我而且对一个页面上多个编辑我必须通过编辑ID来访问它，所以下面为我工作

tinymce.editors['content_id'].getContent();

。

来源

2012-08-21 07:34:39 savitas

这里是一个例子。编辑器下面的文本将被更新，无论是在Visual或HTML模式下发生的键入。

WP tinyMCE onKeyUp

可视模式事件中的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); 
}

测试上：

的WordPress 3.4.2

来源

2012-11-25 20:46:22 NaMarPi

这为我工作：

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

凡文本是对的ID TinyMCE的编辑

来源

2017-03-23 06:26:44

传递param格式：html，这意味着我得到了实际的html - 而不是逃脱<p> – zak 2018-01-18 07:08:08

这是在我测试的每种情况下似乎都适用于我的那个。无论我们从文本模式还是以可视模式开始，并且无论如何改变模式并在此之后添加更多内容。

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'); 
}

来源

2017-04-08 07:00:48 Nikolay

获取WP Tinymce的内容

回答

相关问题