MenuButton（菜单按钮）

扩展自$.fn.iLinkbutton.defaults。使用$.fn.iMenubutton.defaults重写默认值对象。

菜单按钮是下拉菜单的一部分。它伴随着linkbutton和menu组件。在用户点击linkbutton之前菜单是隐藏的，当用户用鼠标点击或移动到linkbutton上面的时候菜单才会显示。

依赖关系

用法

通常菜单按钮通过标签创建。

html

<a href="javascript:void(0)" id="mb" data-toggle="topjui-menubutton" data-options="menu:'#mm',iconCls:'icon-edit'">Edit</a>
<div id="mm" style="width:150px;">
    <div data-options="iconCls:'icon-undo'">Undo</div>
    <div data-options="iconCls:'icon-redo'">Redo</div>
    <div class="menu-sep"></div>
    <div>Cut</div>
    <div>Copy</div>
    <div>Paste</div>
    <div class="menu-sep"></div>
    <div data-options="iconCls:'icon-remove'">Delete</div>
    <div>Select All</div>
</div>

使用Javascript创建菜单按钮。

html

<a href="javascript:void(0)" id="mb">Edit</a>
<div id="mm" style="width:150px;">
    ...
</div>

javascript

$('#mb').iMenubutton({
    iconCls: 'icon-edit',
    menu: '#mm'
});

属性

菜单按钮属性扩展自linkbutton(按钮)，菜单按钮新增的属性如下：

属性名	属性值类型	描述	默认值
method	string	按钮点击事件，内置的方法有：openDialog / doAjax / filter / search / import / export / openTab / openWindow / request	空
iconCls	string	显示在按钮文字左侧的图标(16x16)的CSS类。(如：fa fa-book)	fa fa-cog
btnCls	string	按钮样式，内置的样式有：topjui-btn-green/red/brown/black/blue/orange/purple	topjui-btn-green
extend	string	继承其它元素上的属性值，如继承toolbar上的公共部分属性grid，以减少冗余代码，如果按钮上也配置了grid属性，则按钮上的grid属性值会覆盖继承的属性值，extend的值为jquery选择器，如#id或.class	空
plain	boolean	为true时显示简易效果。	true
menu	string	用来创建一个对应菜单的选择器。	null
menuAlign	string	允许用户设置顶级菜单对齐方式。可用值有：'left','right'。	null
duration	number	定义鼠标划过按钮时显示菜单所持续的时间，单位为毫秒。	100
showEvent	string	菜单显示的事件。	mouseenter
hideEvent	string	菜单隐藏的事件。	mouseleave
hasDownArrow	boolean	定义是否显示向下箭头图标。	true

方法

方法名	方法参数	描述
options	none	返回属性对象。
disable	none	禁用菜单按钮。
enable	none	启用菜单按钮。
destroy	none	销毁菜单按钮。

MenuButton（菜单按钮） ​

依赖关系 ​

用法 ​

属性 ​

方法 ​

MenuButton（菜单按钮）

依赖关系

用法

属性

方法