EasyUI学习之menu and button(菜单和按钮)

最新推荐文章于 2021-04-25 11:02:15 发布

LCore

最新推荐文章于 2021-04-25 11:02:15 发布

阅读量1.2w

点赞数 1

分类专栏：【JQuery EasyUI】文章标签： easyui menu button

本文链接：https://blog.youkuaiyun.com/lcore/article/details/28390559

版权

本文详细介绍了EasyUI中的Menu、LinkButton、MenuButton和SplitButton组件。讲解了它们的属性、方法、事件和使用示例，特别强调了Menu在上下文菜单中的重要性，以及如何创建和操作这些组件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天下午的天气感觉格外的气闷,整个人有一种黏糊糊的感觉,格外的不舒服。加之马上要放假了了

,感觉自己完全坐不住呢(节前综合症么)。不过学习还是的继续的。

原定计划这篇文章本来应该是关于searchBox的介绍的,不过鉴于easyloader里面的依赖关系,searchBox依赖于menubutton,menubutton又依赖于menu和linkbutton。于是乎,打算先对easyui组件中的菜单和按钮进行学习了解。

对于链接按钮由于前面已经做过相关介绍了,这里就不再赘述了.参考"EasyUI基础入门之pagination"即可。

使用$.fn.menu.defaults重载默认值。

菜单通常是用于上下文菜单的。这是基本组件构建其他菜单组件如menubutton、splibutton。它还可以用于导航和执行命令。

菜单项代表的是一个单独的项目,是显示在一个菜单里的。包含如下属性:

到最新版本,菜单具有如下的一些属性:

名称	类型	描述信息	默认值
zIndex	number	菜单的z-index样式，从第一个菜单开始递增(默认值如此大,基本保证了所有菜单项在最上层)	11000000
left	number	菜单的左边距	0
top	number	菜单的顶边距	0
minWidth	number	菜单的最小宽度	120
hideOnUnhover	boolean	当设置为true时,鼠标退出时自动的隐藏菜单	true

名称	属性	描述信息
onShow	none	当一个菜单被显示的时候触发。
onHide	none	当一个菜单被隐藏的时候触发。
onClick	item	当一个菜单被点击时触发。下面的例子显示了如何处理所有菜单项的点击事件: <div class="easyui-menu" data-options="onClick:menuHandler" style="width:120px;"> <div data-options="name:'new'">New</div> <div data-options="name:'save',iconCls:'icon-save'">Save</div> <div data-options="name:'print',iconCls:'icon-print'">Print</div> <div class="menu-sep"></div> <div data-options="name:'exit'">Exit</div> </di