本文实例为大家分享了Jquery Easyui菜单组件的实现代码，供大家参考，具体内容如下
加载方式
菜单组件通常用于快捷菜单，在加载方式上，通过 class 或 JS 进行设置为菜单组件。然后，再通过 JS 事件部分再响应。
<div id="box" class="easyui-menu">
<div>新建</div>
<div>
<span>打开</span>
<!--二次菜单-->
<div style="width:150px;">
<div>Word</div>
<div>Excel</div>
<div>PowerPoint</div>
</div>
</div>
<div data-options="iconCls:'icon-save'">保存</div>
<div class="menu-sep"></div>
<div>退出</div>
</div> <script>
$(function () {
//鼠标右击事件弹出菜单
$(document).on('contextmenu',function(e){
// 阻止系统默认弹出的菜单
e.preventDefault();
// 显示自定义的菜单
$('#box').menu('show', {
left : e.pageX,
top : e.pageY
});
});
});
</script>
菜单项属性
<!--在 data-options 设置，只有两个有效,其他的参数会菜单方法中设置菜单项时有效-->
<div data-options="
iconCls :'icon-save',
disabled : true,">
保存
</div>菜单属性
//菜单属性，设置在 data-options 也同样有效
$('#box').menu({
left : 100,
top : 100,
zIndex : 100,
minwidth : 200,
hideOnUnhover : true,
});菜单事件
// 触发事件
$('#box').menu({
onShow : function () {
alert('显示时触发！');
},
onHide : function () {
alert('隐藏时触发！');
},
onClick : function (item) {
alert(item.text);
}
});菜单方法
//返回属性对象
