Jquery Easyui菜单组件Menu使用详解(15)

前端之家收集整理的这篇文章主要介绍了Jquery Easyui菜单组件Menu使用详解(15)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文实例为大家分享了Jquery Easyui菜单组件的实现代码,供大家参考,具体内容如下

加载方式

菜单组件通常用于快捷菜单,在加载方式上,通过 class 或 JS 进行设置为菜单组件。然后,再通过 JS 事件部分再响应。

Box" class="easyui-menu">
新建
打开
Word
Excel
PowerPoint

菜单属性

菜单属性

菜单属性,设置在 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); } });

菜单方法

属性对象 console.log($('#Box').menu('options'));

//显示菜单
$('#Box').menu('show',{
left : e.pageX,top : e.pageY,});

//隐藏菜单
$('#Box').menu('hide');

//销毁菜单
$('#Box').menu('destroy');

//得到某个菜单项对象
console.log($('#Box').menu('getItem','#new'));

//设置某个菜单项文本
$('#Box').menu('setText',{
target : '#new',text : '修改',});

//设置某个菜单项图标
$('#Box').menu('setIcon',iconCls : 'icon-add',});

//通过文本获取指定的菜单项对象
console.log($('#Box').menu('findItem','新建'));

//追加一个顶层菜单
$('#Box').menu('appendItem',{
text : '新增',onclick : function () {
alert('新增');
},});

//追加一个子菜单
$('#Box').menu('appendItem',{
parent : $('#Box').menu('findItem','打开').target,text : '新增',onclick : function () {
alert('新增');
},});

//移出指定菜单
$('#Box').menu('removeItem','#new');

//禁用指定菜单
$('#Box').menu('disableItem','#new');

//启用指定菜单
$('#Box').menu('enableItem','#new');

//使用$.fn.menu.defaults 重写默认值对象。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的jQuery相关文章