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值
            }
        })
    })
})