Question

我有一个包含一些子菜单项的上下文菜单。我试着设置如下

    editor.addMenuGroup('newMenu'); 
    editor.addCommand("submenu1", { exec: function(b) { alert('submenu1'); } });
    editor.addCommand("submenu2", { exec: function(b) { alert('submenu2'); } });
    editor.addMenuItems && editor.addMenuItems({
        newMenuItem: {
            label: "Menu1", group: "newMenu", order: 1,
            getItems: function() {
                return {
                    submenu1: CKEDITOR.TRISTATE_OFF,
                    submenu2: CKEDITOR.TRISTATE_OFF
                }
            }
        },

        submenu1: {
           label: "Sub-Menu1",
           group: "newMenu", 
           command: "submenu1",
           icon:CKEDITOR.getUrl('plugins/icons.png'), //Here adding the icon,first icon only coming
           order: 2
           },
        submenu2: { 
           label: "Sub-Menu2", 
           group: "newMenu", 
           command: "submenu2",
           icon:CKEDITOR.getUrl('plugins/icons.png'),//Here adding the icon,first icon only coming
           order: 3
         }
       });

这里两个子菜单项图标都是相同的。它采取了icons.png的第一个图标。我知道我在这里错过了一些提到图标位置的东西，但我不知道如何在这里给出这个位置。有人知道吗？

Answer 1

您所要做的就是将图标注册为皮肤的一部分（CKEDITOR.skin.addIcon）。一旦你这样做，你基本上可以通过它的名字（fiddle）来引用它：

// Define the icon as a part of the skin first.
CKEDITOR.skin.addIcon( 'twitter', 'https://abs.twimg.com/favicons/favicon.ico' );

var editor = CKEDITOR.replace( 'editor', {
    plugins: 'wysiwygarea,sourcearea,basicstyles,toolbar',
    on: {
        pluginsLoaded: function() {           
            this.ui.addButton( 'Foo', {
                label: 'Foo',
                command: 'bold',
                // Use it!
                icon: 'twitter'
            });         

            this.ui.addButton( 'Bar', {
                label: 'Bar',
                command: 'italic',
                // Use it once again!
                icon: 'twitter'
            });             
        }
    }
} );

CKEDITOR 4：如何重用上下文子菜单中已有的图标。

1 个答案: