wordpress wp_editor Tiny MCE getContent不返回HTML视图的内容

neskvpey  于 2023-06-21  发布在  WordPress
关注(0)|答案(6)|浏览(206)

我在一个正在开发的插件中使用wp_editor,并且注意到如果编辑器在HTML视图中(与可视化编辑器相反),.getContent()不会获取编辑器的内容。
如果在HTML视图中加载编辑器,则将返回

tinyMCE.get(inputid) is undefined

但即使我尝试通过以下方式获取内容:

jQuery("#"+inputid).html() or jQuery("#"+inputid).val()

它返回null。更让我信服的是,如果编辑器以可视化模式加载,切换到HTML视图,进行一些更改,然后使用.getContent(),它将返回可视化编辑器在进行任何更改之前的值。
我拉出我有限的头发供应与这一个,所以帮助将不胜感激!

mitkmikd

mitkmikd1#

我也在为同样的问题而挣扎。原因是visual选项卡中的编辑器是tinyMCE,而html选项卡中的编辑器只是一个普通的文本区域。不知何故,tinyMCE编辑器在html标签激活时没有激活,所以你需要查询文本区域。textarea将id传递给wp_editor()函数。您可以使用传统的jquery方法查询它。
例如,如果tinyMCE编辑器被激活,则该代码将一个名为content的变量设置为tinyMCE编辑器的内容,如果tinyMCE没有返回任何内容(因为HTML选项卡被选中),则该代码将该内容设置为textarea的内容:

var content;
var editor = tinyMCE.get(inputid);
if (editor) {
    // Ok, the active tab is Visual
    content = editor.getContent();
} else {
    // The active tab is HTML, so just query the textarea
    content = $('#'+inputid).val();
}
8wigbo56

8wigbo562#

为了让它100%工作,我必须这样做:

function get_tinymce_content(id) {
    var content;
    var inputid = id;
    var editor = tinyMCE.get(inputid);
    var textArea = jQuery('textarea#' + inputid);    
    if (textArea.length>0 && textArea.is(':visible')) {
        content = textArea.val();        
    } else {
        content = editor.getContent();
    }    
    return content;
}
mcvgt66p

mcvgt66p3#

这是我正在使用的功能,从未让我失望过。
它真的很简单,甚至可以工作,如果TinyMCE还没有加载。它只是检查 Package 器的类,这是非常安全的使用。

function get_tinymce_content(id) {

    if (jQuery("#wp-"+id+"-wrap").hasClass("tmce-active")){
        return tinyMCE.get(id).getContent();
    }else{
        return jQuery("#"+id).val();
    }

}
ztigrdn8

ztigrdn84#

您需要在jQuery("#"+inputid).html()生成实际的编辑器内容之前调用tinyMCE.triggerSave();
(btw. html view是什么意思)

9jyewag0

9jyewag05#

您可以像这样检查活动选项卡:

let content;
const editor = tinyMCE.get(inputid);
if (null !== editor && false === editor.hidden) {
    // Ok, the active tab is Visual
    content = editor.getContent();
} else {
    // The active tab is HTML, so just query the textarea
    content = $('#'+inputid).val();
}
bq8i3lrv

bq8i3lrv6#

如果您在同一页面上有多个编辑器,您可以按如下所示定位特定的ID。

var content = tinymce.get( 'request-description' ).getContent()

其中request-description是编辑器的ID

相关问题