效果:
EasyUI - Menu 菜单

 

html代码:

<div id="mm" class="easyui-menu">
    <div id ="0">New</div>
    <div>
        <span id ="1">Open</span>
        <div style="width: 150px;">
            <div id ="1.0"><b>Word</b></div>
            <div id ="1.1">Excel</div>
            <div id ="1.2">PowerPoint</div>
        </div>
    </div>
    <div id ="2" data-options="iconCls:'icon-save'">Save</div>
    <div id ="3" class="menu-sep"></div>
    <div id ="4">Exit</div>
</div>

 

JavaScript代码:

$(function () {
    //禁止使用浏览器的右键菜单
    $(document).on('contextmenu', function (e) {
        e.preventDefault();

        //此时使用EasyUI的Menu菜单
        $('#mm').menu('show', {
            left: e.pageX,
            top: e.pageY,
        });

        //菜单事件
        $('#mm').menu({
            onClick: function (e) {
                alert(e.id);//获取菜单的id值
            }
        })
    })
})

 

相关文章:

  • 2021-11-29
  • 2021-06-30
  • 2021-11-21
  • 2021-12-16
  • 2021-12-24
  • 2021-08-28
  • 2021-07-29
  • 2021-08-25
猜你喜欢
  • 2021-06-13
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-01-04
  • 2021-06-10
相关资源
相似解决方案