TinyMCE的4插件菜单下拉菜单栏

Question

我需要添加另一个下拉菜单旁边的“工具”项中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!!'); 
     } 
     }); 
    } 
}); 

但它只是添加一个项目到已经存在的“工具”菜单。

Answer 1

你可以尝试同时指定“菜单”和“菜单栏的结果'选项时调用tinymce.init（）在现代主题上添加一个新的菜单栏项目。

我试过了，它的工作原理。

您可以用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> 

Answer 2

不知道这是你需要什么，但如果你试试这个：

<script type="text/javascript"> 
tinymce.init({ 
    selector: "textarea", 
    toolbar: "mybutton", 
    setup: function(editor) { 
     editor.addButton('mybutton', { 
      type: 'menubutton', 
      text: 'My button', 
      icon: false, 
      menu: [ 
       {text: 'Menu item 1', onclick: function() {editor.insertContent('Menu item 1');}}, 
       {text: 'Menu item 2', onclick: function() {editor.insertContent('Menu item 2');}} 
      ] 
     }); 
    } 
}); 
</script> 

您可以查看代码here