Question

我为timymce4制作了一个小插件，它增加了1个带有标题列表的下拉菜单（例如.h1，h2 ......）所以我想要做的是用相应的样式（<h1>Header H1</h1>）打印这些元素标题，而不是html，我用纯文本来获取它。我做错了什么？

tinyMCE.PluginManager.add('headings', function(editor, url) {
    ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].forEach(function(name){
        editor.addMenuItem("headers_" + name, {
            tooltip: "<"+name+">Заголовок</" + name+">",
            text: "<"+name+">Заголовок</" + name+">",
            onClick: function() { editor.execCommand('mceToggleFormat', false, name); },
            onPostRender: function() {
                var self = this, setup = function() {
                    editor.formatter.formatChanged(name, function(state) {
                        self.active(state);
                    });
                };
                editor.formatter ? setup() : editor.on('init', setup);
            }
        })
    });
});

我哪里错了？

Answer 1

据我所知，TinyMCE不允许使用HTML菜单项，而不是addMenuItem - 或者至少我没有找到任何记录的案例（对象的描述上面的方法很无用）。相反，您可能对以下内容感兴趣，它允许设置新的样式格式并自动处理它们的显示方式 - 虽然我无法找到如何在格式按钮中创建子菜单，但我确信它必须是可能的：

<script type="text/javascript">
tinymce.init({
    selector: "textarea",
    style_formats: [
        {title: 'Bold text', inline: 'b'},
        {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
        {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
        {title: 'Example 1', inline: 'span', classes: 'example1'},
        {title: 'Example 2', inline: 'span', classes: 'example2'},
        {title: 'Table styles'},
        {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
    ]
});
</script>
<form method="post" action="dump.php">
    <textarea name="content"></textarea>
</form>

http://fiddle.tinymce.com/uaeaab

如果您仍然有兴趣实现自己定制的向菜单添加HTML代码的方式，我相信您可以找到TinyMCE为上述style_formats设置执行此操作的方式。但是，根据我对这些JavaScript编辑器的经验，许多更“高级”的API功能会经常发生变化;通常最好坚持使用文档化的更高级API调用和设置。

使js打印html而不是纯文本

1 个答案: