jQuery右键菜单插件 jQuery ContextMenu

来源：互联网发布：挂历制作软件编辑：程序博客网时间：2024/05/01 15:54

上网找了一下，有两个同名的

http://swisnl.github.io/jQuery-contextMenu/demo/on-dom-element.html#example-code

Example code

$(function(){    $('#the-node').contextMenu({        selector: 'li',         callback: function(key, options) {            var m = "clicked: " + key + " on " + $(this).text();            window.console && console.log(m) || alert(m);         },        items: {            "edit": {name: "Edit", icon: "edit"},            "cut": {name: "Cut", icon: "cut"},            "copy": {name: "Copy", icon: "copy"},            "paste": {name: "Paste", icon: "paste"},            "delete": {name: "Delete", icon: "delete"},            "sep1": "---------",            "quit": {name: "Quit", icon: function($element, key, item){ return 'icon icon-quit'; }}        }    });});

Example HTML

<ul id="the-node">    <li><span class="context-menu-one btn btn-neutral">right click me 1</span></li>    <li><span class="context-menu-one btn btn-neutral">right click me 2</span></li>    <li>right click me 3</li>    <li>right click me 4</li></ul>

http://ignitersworld.com/lab/contextMenu.html#intro

//For example we are defining menu in object. You can also define it on Ul list. See on documentation.
varmenu = [{
        name:'create',
        img:'images/create.png',
        title:'create button',
        fun:function() {
            alert('i am add button')
        }
    }, {
        name:'update',
        img:'images/update.png',
        title:'update button',
        fun:function() {
            alert('i am update button')
        }
    }, {
        name:'delete',
        img:'images/delete.png',
        title:'delete button',
        fun:function() {
            alert('i am delete button')
        }
    }];
 
//Calling context menu
 $('.testButton').contextMenu(menu);

0 0