jQuery EasyUI Menu and Button Plugin - Menubutton Menu Button
Extends from $.fn.linkbutton.defaults. Overrides the default defaults with $.fn.menubutton.defaults.
The menu button (menubutton) is a part of the dropdown menu. It is related to the link button (linkbutton) and the menu (menu). It displays the link button (linkbutton) and hides the menu (menu). When the user clicks or moves the mouse over the link button (linkbutton), the menu (menu) is displayed to allow the user to click on the menu.
Dependencies
- menu
- linkbutton
Usage
Typically, the menu button (menubutton) is created declaratively from markup.
<a href="javascript:void(0)" id="mb" class="easyui-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>
Create a menu button (menubutton) using JavaScript.
<a href="javascript:void(0)" id="mb">Edit</a>
<div id="mm" style="width:150px">
...
</div>
$('#mb').menubutton({
iconCls: 'icon-edit',
menu: '#mm'
});
Properties
The properties extend from the link button (linkbutton). The following are the properties added by the menu button (menubutton).
Name | Type | Description | Default Value |
---|---|---|---|
plain | boolean | If set to true, displays a simple effect. | true |
menu | string | The selector used to create the corresponding menu (menu). | null |
duration | number | The duration in milliseconds to display the menu (menu) when hovering over the button. | 100 |
Methods
The methods inherit from the link button (linkbutton). The following are the methods added or overridden by the menu button (menubutton).
Name | Parameters | Description |
---|---|---|
options | none | Returns the options object. |
disable | none | Disables the menu button (menubutton). |
enable | none | Enables the menu button (menubutton). |
destroy | none | Destroys the menu button (menubutton). |