jQuery EasyUI API 中文文档 - Menu菜单

用 $.fn.menu.defaults 重写了 defaults。




代码如下:

<div id="mm" class="easyui-menu" style="width:120px;">
<div>New</div>
<div>
<span>Open</span>
<div style="width:150px;">
<div><b>Word</b></div>
<div>Excel</div>
<div>PowerPoint</div>
</div>
</div>
<div iconCls="icon-save">Save</div>
<div class="menu-sep"></div>
<div>Exit</div>
</div>

编程创建 menu 并侦听 'onClick' 事件。


代码如下:

$('#mm').menu({
onClick:function(item){
//...
}
});

显示 Menu
当 menu 被创建时，它是隐藏不可见的。调用 'show' 方法来显示 menu。


代码如下:

$('#mm').menu('show', {
left: 200,
top: 100
});

特性
























名称

类型

说明

默认值

zIndex

number

Menu 的 z-index 样式， 从它开始增加。.

110000

left

number

Menu 的左边位置。

0

top

number

Menu 的顶部位置。

0


事件



















名称

参数

说明

onShow

none

当 menu 显示之后触发。

onHide

none

当 menu 隐藏之后触发。

onClick

item

当点击 menu item 时触发。


方法















































名称

参数

说明

show

pos

在指定的位置显示 menu 。
pos 参数有两个特性：
left：新的左边位置。
top：新的顶部位置。

hide

none

隐藏 menu 。

getItem

itemEl

获取 menu item 数据并返回，该数据包含下列特性：
target：DOM 对象，即 menu item。
id：string，元素的 id 属性。
text：string，menu item 的文字。
href：string，定位的 url。
disabled：boolean，menu item 禁用与否。
onclick：function，当用户点击 menu item 时执行的函数。
iconCls：string，图标的 CSS 类。

setText

param

给指定的 menu item 设置文字。 'param' 包含两个特性：
target：DOM 对象，被设定的 menu item 。
text： string，新的文字值。

setIcon

param

给指定的 menu item 设置图标。 'param' 包含两个特性：
target： DOM 对象， 即 menu item。
iconCls： 新图标的 CSS 类。

findItem

text

找到指定的 menu item， 返回对象与 getItem 方法相同。

appendItem

param

追加 menu item， 'param' 参数包含下列特性：
parent： DOM 对象， 新 menu item 将追加到其中， 如果没有设定， 新menu item 将作为顶级 menu item。
text： string， menu item 的文字。
href： string， 定位的 url 。
onclick： string 或者 function， 当用户点击 menu item时执行的脚本代码或者函数。
iconCls： string， 图标的 CSS 类。

removeItem

itemEl

移除指定的 menu item。

enableItem

itemEl

启用 menu item。

disableItem

itemEl

禁用 menu item。

风流涕淌 翻译。

赞 (0)

相关推荐

  • Jquery Easyui分割按钮组件SplitButton使用详解（17）

    Jquery Easyui分割按钮组件SplitButton使用详解（17）

    SpliButton组件依赖于Menu(菜单)组件和 LinkButton(按钮)组件 加载方式 Class加载 <a href="javascript:void(0)" id="edit" class="easyui-splitbutton" data-options="menu:'#box',iconCls:'icon-edit'">编辑</a> <div id="box"

  • vue多级多选菜单组件开发

    vue多级多选菜单组件开发

    本文实例为大家分享了vue多级多选菜单组件的制作方法,供大家参考,具体内容如下 要开发一个这样的多级多选菜单组件,功能是: 点击父标题栏可以打开与折叠子列表 点击父标题栏的勾选图标可以全选或取消子列表 点击子列表的勾选图标达到全选时,父标题栏的勾选图标自动勾选:反之,没达到全选时,父标题栏的勾选图标自动取消勾选 当所有父标题栏的勾选图标达到全选时,最底下那个全选框自动勾选:反之,没达到全选时,最底下那个全选框自动取消勾选 点击最底下那个全选框可以全选或取消全部的勾选图标 所以总结起来我们重点要利

  • Jquery Easyui日历组件Calender使用详解（23）

    Jquery Easyui日历组件Calender使用详解（23）

    本文实例为大家分享了Jquery Easyui日历组件的实现代码,供大家参考,具体内容如下 加载方式 Class加载 <div id="box" class="easyui-calendar" style="width:200px;height:200px;"></div> JS调用加载 <div id="box"></div> <script> $(function

  • Bootstrap按钮下拉菜单组件详解

    Bootstrap按钮下拉菜单组件详解

    按钮组也是一个独立的组件,按钮组和下拉菜单组件一样,需要依赖于button.js插件才能正常运作. 把一组<div class="btn-group">组合进一个<div class="btn-toolbar">做成更复杂的组件. <div class="btn-toolbar" role="toolbar"> <div class="btn-group">

  • Jquery Easyui菜单组件Menu使用详解（15）

    Jquery Easyui菜单组件Menu使用详解（15）

    本文实例为大家分享了Jquery Easyui菜单组件的实现代码,供大家参考,具体内容如下 加载方式 菜单组件通常用于快捷菜单,在加载方式上,通过 class 或 JS 进行设置为菜单组件.然后,再通过 JS 事件部分再响应. <div id="box" class="easyui-menu"> <div>新建</div> <div> <span>打开</span> <!--二次菜单--&

  • Jquery Easyui自定义下拉框组件使用详解（21）

    Jquery Easyui自定义下拉框组件使用详解（21）

    本文实例为大家分享了Jquery Easyui自定义下拉框组件的实现代码,供大家参考,具体内容如下 加载方式 JS调用加载 自定义下拉框不能通过标签的方式进行创建. <input id="box" /> <script> $(function () { //JS 加载调用 $('#box').combo({ required : true, multiple : true, }); }); </script> 属性列表 <script>

  • Jquery Easyui验证组件ValidateBox使用详解（20）

    Jquery Easyui验证组件ValidateBox使用详解（20）

    本文实例为大家分享了Jquery Easyui验证组件的实现代码,供大家参考,具体内容如下 加载方式 Class加载 <input id="email" class="easyui-validatebox" data-options="required:true,validType:'email'" /> JS调用加载 <input id="email" /> <script> $(func

  • jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍

    jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍

    扩展自 $.fn.linkbutton.defaults.用 $.fn.menubutton.defaults 重写了defaults. 依赖 menu linkbutton 用法 复制代码 代码如下: <a href="javascript:void(0)" id="mb" iconCls="icon-edit">Edit</a> <div id="mm" style="width:1

  • iOS中长按调出菜单组件UIMenuController的使用实例

    iOS中长按调出菜单组件UIMenuController的使用实例

    UIMenuController的使用 UIMenuController的展现需要基于一个View视图,其交互则需要基于其所在View视图的Responder.举例来说,如果一个UIMenuController展现在当前ViewController的View上,则此UIMenuController的交互逻辑交由当前的ViewController进行管理. 在界面展示出UIMenuController需要3个条件: 1.当前的Responder处于第一响应. 2.UIMenuController对

  • Jquery Easyui搜索框组件SearchBox使用详解（19）

    Jquery Easyui搜索框组件SearchBox使用详解（19）

    本文实例为大家分享了Jquery Easyui搜索框组件的实现代码,供大家参考,具体内容如下 加载方式 Class加载 <input id="ss" class="easyui-searchbox" style="width:300px" data-options="prompt:'Please Input Value',menu:'#box'"> </input> <div id="b

随机推荐