TinyMCE 4将下拉菜单添加到菜单栏

Tom*_*arz 6 javascript jquery tinymce tinymce-4

我需要在TinyMCE 4中的"工具"项旁边添加另一个下拉菜单:

新物品

我找到的最接近的解决方案是:

// Adds a custom menu item to the editor that inserts contents when clicked
// The context option allows you to add the menu item to an existing default menu
tinymce.init({
   ...

   setup: function(ed) {
      ed.addMenuItem('example', {
         text: 'My menu item',
         context: 'tools',
         onclick: function() {
            ed.insertContent('Hello world!!');
         }
      });
   }
});
Run Code Online (Sandbox Code Playgroud)

但它只在已经存在的"工具"菜单中添加了一个项目.

gun*_*kun 16

当您调用tinymce.init()以在现代主题上添加新的菜单栏项时,您可以尝试指定'menu'和'menubar'选项.

我尝试了它,它的工作原理.

您可以使用TinyMCE 4.1.7 在http://fiddle.tinymce.com/39eaab/1上查看现场演示.

<script type="text/javascript">
tinymce.init({
    selector: "textarea",
    menu : {
        file   : {title : 'File'  , items : 'newdocument'},
        edit   : {title : 'Edit'  , items : 'undo redo | cut copy paste pastetext | selectall'},
        insert : {title : 'Insert', items : 'link media | template hr'},
        view   : {title : 'View'  , items : 'visualaid'},
        format : {title : 'Format', items : 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
        table  : {title : 'Table' , items : 'inserttable tableprops deletetable | cell row column'},
        tools  : {title : 'Tools' , items : 'spellchecker code'},
        newmenu: {title : 'New Menu', items : 'newmenuitem'}
    },
    menubar: 'file edit newmenu',
    setup: function(editor) {
        editor.addMenuItem('newmenuitem', {
            text: 'New Menu Item',
            context: 'newmenu',
            onclick: function () { alert('yey!'); }
        });
    }
});
</script>

<form method="post" action="dump.php">
    <textarea name="content"></textarea>
</form>
Run Code Online (Sandbox Code Playgroud)