jQuery EasyUI使用教程之创建一个菜单按钮

<jQuery EasyUI最新版下载>

本教程主要为大家展示如何使用jQuery EasyUI创建一个菜单按钮。菜单按钮包含了一个按钮和菜单组件,当点击或将鼠标移动到该按钮上时,相应的菜单就会显示。

创建一个菜单按钮

查看演示

想要定义一个菜单按钮,首先你应该先定义一个链接按钮和一个菜单,下面是一个示例:

< div style = "background:#fafafa;padding:5px;width:200px;border:1px solid #ccc" >
< a href = "#" class = "easyui-menubutton" menu = "#mm1" iconcls = "icon-edit" >Edit</ a >
< a href = "#" class = "easyui-menubutton" menu = "#mm2" iconcls = "icon-help" >Help</ a >
</ div >
< div id = "mm1" style = "width:150px;" >
< div iconcls = "icon-undo" >Undo</ div >
< div 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 iconcls = "icon-remove" >Delete</ div >
< div >Select All</ div >
</ div >
< div id = "mm2" style = "width:100px;" >
< div >Help</ div >
< div >Update</ div >
< div >About</ div >
</ div >

现在,菜单按钮就已经完成了,你不需要写任何的JavaScript代码了。

有兴趣的朋友可以点击查看更多有关jQuery EasyUI的文章

你可能感兴趣的:(jQuery EasyUI使用教程之创建一个菜单按钮)