jquery 右键菜单

jQuerycontextMenu

<div class="context-menu-one box menu-1">
    <strong>right click me</strong>
</div>

$(function(){
    $.contextMenu({
        selector: '.context-menu-one', 
        callback: function(key, options) {
            var m = "clicked: " + key;
            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: "quit"}
        }
    });
    
    $('.context-menu-one').on('click', function(e){
        console.log('clicked', this);
    })
});

jquery简短右键菜单多浏览器兼容

http://www.jb51.net/article/21699.htm

$(function () {
    document.oncontextmenu = function () {
        return false;
    }//屏蔽右键 
    document.onmousemove = mouseMove;//记录鼠标位置 
});
var mx = 0, my = 0;
function mouseMove(ev) {
    Ev = ev || window.event;
    var mousePos = mouseCoords(Ev);
    mx = mousePos.x;
    my = mousePos.y;
}
function mouseCoords(ev) {
    if (ev.pageX || ev.pageY) {
        return{x: ev.pageX, y: ev.pageY};
    }
    return{x: ev.clientX, y: ev.clientY + $(document).scrollTop()};
}

$.fn.extend({RightMenu: function (id, options) {
    options = $.extend({menuList: []}, options);
    var menuCount = options.menuList.length;
    if (!$("#" + id)[0]) {
        var divMenuList = "<div id=\"" + id + "\" class=\"div_RightMenu\"><div><ul class='ico'>";
        for (var i = 0; i < menuCount; i++) {
            divMenuList += "<li class=\"RMli_" + options.menuList[i].menuclass + "\" onclick=\"" + options.menuList[i].clickEvent + "\">" + options.menuList[i].menuName + "</li>";
        }
        divMenuList += "</ul></div><div>";
        $("body").append(divMenuList).find("#" + id).hide().find("li")
            .bind("mouseover", function () {
                $(this).addClass("RM_mouseover");
            })
            .bind("mouseout", function () {
                $(this).removeClass("RM_mouseover");
            });
        $(document).click(function () {
            $("#" + id).hide();
        });
    }
    return this.each(function () {
        this.oncontextmenu = function () {
            　　　　　　　　/*这段 判断鼠标移到页面的最右侧或者最下侧 防止出现滚动条 ｛*/
            var mw = $('body').width(), mhh = $('html').height(), mbh = $('body').height(),
                w = $('#' + id).width(), h = $('#' + id).height(),
                mh = (mhh > mbh) ? mhh : mbh;//最大高度 比较html与body的高度 
            if (mh < h + my) {
                my = mh - h;
            }//超 高 
            if (mw < w + mx) {
                mx = mw - w;
            }
            //超 宽 
            　　　　　　/*｝ 当然也可以直接跳过*/
            $("#" + id).hide().css({top: my, left: mx}).show();
        }
    });
}
});