是否可以创建一个包含工具栏按钮的下拉样式菜单?
我想在工具栏上放一个按钮,将对齐按钮(可能还有其他按钮)分组到一个下拉菜单中。
由于
答案 0 :(得分:7)
问题并不是那么难,但你还是要编写几行代码。 pluginsLoaded
中的以下逻辑可以(应该)在全新插件的init
中定义(可以称为" groupped-justify")。否则,如果执行得太晚,例如生成工具栏后,整个代码没有任何意义。
请参阅official plugin development guide了解详情。
另请参阅jsFiddle并附上一个工作示例。
CKEDITOR.replace( 'editor', {
plugins: 'wysiwygarea,sourcearea,basicstyles,toolbar,menu,menubutton,justify',
on: {
pluginsLoaded: function() {
var editor = this,
items = {};
editor.addMenuGroup( 'some_group' );
items.justifyleft = {
label: editor.lang.justify.left,
group: 'some_group',
command: 'justifyleft',
order: 1
};
items.justifyright = {
label: editor.lang.justify.right,
group: 'some_group',
command: 'justifyright',
order: 2
};
editor.addMenuItems( items );
editor.ui.add( 'Groupped', CKEDITOR.UI_MENUBUTTON, {
label: 'Groupped justify',
// Disable in source mode.
modes: {
wysiwyg: 1
},
icon: 'JustifyLeft',
onMenu: function() {
var active = {};
// Make all items active.
for ( var p in items )
active[ p ] = CKEDITOR.TRISTATE_OFF;
return active;
}
} );
}
}
} );
答案 1 :(得分:1)
我有与@oleq建议的代码相同的代码。在我的情况下,我需要在插件初始化,因此可以显示菜单项,因为"命令"在items对象中。我不知道为什么会发生这种情况,但我设法通过删除命令并将onClick事件添加到每个项目来修复它
items.flleft = {
label: "Add and align left",
group: 'some_group',
icon: this.path + 'icons/imgtemplate_left.png',
order: 1,
onClick: function(){
// Do stuff on menu item clicked
}
};
希望这有帮助