如何在jquery中获取tinymce内容?

时间:2016-08-17 16:12:08

标签: jquery html tinymce

我试图获取tinymce数据,但得到tinyMCE未定义错误。这是我的代码:

function savePost( ){ 

    console.log(  jQuery('#wp_tinymce_editor').tinyMCE().getContent() );
}

请检查

3 个答案:

答案 0 :(得分:12)

TinyMCE对象/库是负责编辑器的对象/库,因此您应该使用该对象来获取内容。

您可以使用activeEditor,或者如果(由于某种原因)您拥有在jQuery对象中创建编辑器的原始元素,您可以使用该jQuery对象来获取id原始元素和使用它以获取TinyMCE的内容(使用TinyMCE编辑器)。

  

仅限jQuery - 您绝不应该使用此

如果由于某种原因你真的必须只使用jQuery(我真的不明白为什么),你可以使用原始元素的id,与_ifr连接并获取内容。使用此选项可能会让您不想要,因为tinymce会向dom中存在的html添加标签,但在调用getContent函数时会被剥离。

以下是3个选项的示例:

$('#btn1').click(function() {
    console.log(tinyMCE.activeEditor.getContent());
});
$('#btn2').click(function() {
    console.log(tinyMCE.editors[$('#ta').attr('id')].getContent());
});
$('#btn3').click(function() {
    alert('You should really NOT use this option');
    console.log($('#ta_ifr')[0].contentDocument.body.innerHTML);
});

以下是一个工作示例:https://jsfiddle.net/8tdf3q22/

答案 1 :(得分:0)

<textarea class="tinymce" id="texteditor"></textarea>

在jquery中,您可以这样做。

var content = tinymce.get("texteditor").getContent();

答案 2 :(得分:0)

Html 文本编辑器文本代码:

<textarea name="description" class="tinymce" id="texteditor"></textarea>

您可以像这样使用 javascript 打印 TinyMCE 文本编辑器代码。

var content = tinymce.get("texteditor").getContent();
alert(descriptionFieldTxt);

输出:

enter image description here

带标签的输出
enter image description here

现在你可以打印tinymce texteditor 的值而没有像这样的 p 标签

var content = tinymce.get("texteditor").getContent({format: "text"});
alert(descriptionFieldTxt);

此代码打印没有标签的文本:

enter image description here