Question

在WordPress中，我添加了一个自定义编辑器按钮，以获取所选内容并将其包装为简码。内容没有获取所选内容周围的标签。

例如：

<h1>Heading text</h1>

成为

<h1>[shortcode]Heading Text[/shortcode]</h1>

不是

[shortcode]<h1>Heading Text</h1>[/shortcode]

它确实适用于

<h1>Header</h1>
<h2>Sub-Header</h2>

成为

[shortcode]<h1>Header</h1>
<h2>Sub-Header</h2>[/shortcode]

这是我的代码。

(function() {
tinymce.create('tinymce.plugins.zgwd', {
    init : function(ed, url) {
        ed.addButton('headerblock', {
            title : 'Add a Header Block',
            cmd: 'headerblock',
        });

        ed.addCommand('headerblock', function() {
            var selected_text = ed.selection.getContent({ format: 'html' });
            var return_text = '';
            if( !(selected_text && selected_text.length > 0) ) {
                selected_text = 'Add header block text here';
            }
            return_text = '[header-block]' + selected_text + '[/header-block]';
            ed.execCommand('mceInsertContent', 0, return_text);
        });

    },
    createControl : function(n, cm) {
        return null;
    },
});
tinymce.PluginManager.add('zgwd', tinymce.plugins.zgwd);
})();

如何获取包含<h1>标签（或类似标签）的内容。我使用错误的功能获取内容还是在某处缺少设置？我尝试了.getnode()，但得到了相同的结果。

Answer 1

如果您想使用单个block标签做某事，那么getNode是您的最佳选择。如果您在开发工具中打开控制台的情况下查看此Fiddle，请尝试选择一行，然后尝试同时选择两者。根据选择，getNode（）和getContent（）的行为略有不同。

getNode（）返回选定的元素，但是，如果您选择了多个元素，它将返回the common ancestor（在这种情况下为主体）。

如果选择多个块，

getSelection（）将返回标签，这就是为什么当试图包围多个块标签时它可以工作的原因。

TinyMCE-用于包装选择而不选择周围标签的按钮

1 个答案: