如何在jquery中获取tinymce内容?

问题描述 投票:0回答:4

我正在尝试获取tinymce数据,但出现tinyMCE未定义错误。这是我的代码:

function savePost( ){ 

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

请检查

jquery html tinymce
4个回答
27
投票

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/


6
投票

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

现在你可以像这样打印没有p标签的tinymce文本编辑器值

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

此代码打印不带标签的文本:

enter image description here


0
投票
<textarea class="tinymce" id="texteditor"></textarea>

在jquery中,你可以这样做。

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

0
投票

如果有人在一个页面上有超过 1 个tinyMCE 编辑器并且想知道哪一个处于活动状态:

console.log( window.wpActiveEditor);

上面的代码将显示textarea id值。

© www.soinside.com 2019 - 2024. All rights reserved.