EasyUi之menubutton

1、继承自linkbutton

<a href="javascript:void(0)">编辑</a>

<a href="javascript:void(0)"

    id="edit" class="easyui-menubutton" iconCls="icon-edit">编辑</a>

2、选项

<a href="javascript:void(0)"

    id="edit" class="easyui-menubutton" iconCls="icon-edit" menu="#menubtn">编辑</a>

  

     <div id="menubtn" style="width: 150px">

     <div>剪切</div>

     <div>复制</div>

     <div>粘贴</div>

     <div>删除</div>

     <div>隐藏</div>

     </div>

效果：

3、加图标

 iconCls="icon-add">即可

 class="easyui-menubutton"最重要

$(function(){

$('#edit').menubutton({  

menu:'#menubtn'

});  

})

4、扁平

$(function(){

$('#edit').menubutton({  

menu:'#menubtn',

iconCls:"icon-edit",

plain:false,

});  

})

5、其他属性

duration:100,多长时间显现

$(function(){

$('#edit').menubutton({  

menu:'#menubtn',

iconCls:"icon-edit",

plain:false,

duration:100,

disabled:true,

});  

方法：

console.log($('#edit').menubutton('options'));

})

 

$('#edit').menubutton('destroy');