JQuery---右键菜单版本二

来源：互联网发布：vb绘图控件编辑：程序博客网时间：2024/06/05 21:07
http://blog.csdn.net/xxb2008/article/details/8903131
;/*  * feifei--rightMenu.1.1   说明：   增加了，通过js直接调用 rightMenuJs方法，显示菜单 * * which : right,   //right middle left menus:[     {         name:"name",  //菜单名         click:null,   ///点击事件         eventData:null,   //传给点击事件的参数     } ]  <div id="RightMenu">      <ul>         <li>添加部门</li>         <li>编辑部门</li>     </ul> </div>  */(function ($) {    var menuId = "RightMenu";    var documentClick = function () {    }    $.rightMenuJs = function (options) {        var $menuBox = [];        var _options = {data:{}, menus:[], left:0, top:0}        _options = $.extend(_options, options);        _buildMenu(_options);        $menuBox = $("#" + menuId);        setEvent();        setMenuEvent();        $menuBox.data("data", _options.data);        function setEvent() {            $(document).unbind("click", documentClick);            documentClick = _documentClick;            $(document).bind("click", documentClick);        }        function setMenuEvent() {            var $menuLi = $menuBox.find("li").hover(function () {                $(this).addClass("over");            }, function () {                $(this).removeClass("over");            });            $menuLi.each(function (i) {                var menu = options.menus[i];                if (menu.click) {                    if (!menu.eventData) menu.eventData = {};                    menu.eventData.data = _options.data;                    $(this).click(menu.eventData, menu.click);                    $(this).click(menu.eventData, function () {                        $menuBox.hide();                    });                }            });        }        function _documentClick(e) {            var isHide1 = $(e.target).parents("#" + menuId).length;            if (!isHide1) {                $menuBox.hide();                $(document).unbind("click", documentClick);            }        }    }    $.rightMenu = function (box, options) {        box = $(box);        var $menuBox = [];        box.bind("contextmenu", function () {            return false        });        var witchs = {            right:3,            middle:2,            left:1        }        box.mousedown(function (e) {            e.preventDefault();            e.stopPropagation();            options.left = e.pageX;            options.top = e.pageY;            if (e.which == witchs[options.which]) {                _buildMenu(options);                $menuBox = $("#" + menuId);                $menuBox.bind("contextmenu", function () {                    return false                });                setEvent();                setMenuEvent();                $menuBox.data("source", box);            }        });        function setEvent() {            $(document).unbind("click", documentClick);            documentClick = _documentClick;            $(document).bind("click", documentClick);        }        function setMenuEvent() {            var $menuLi = $menuBox.find("li").hover(function () {                $(this).addClass("over");            }, function () {                $(this).removeClass("over");            });            $menuLi.each(function (i) {                var menu = options.menus[i];                if (menu.click) {                    if (!menu.eventData) menu.eventData = {};                    menu.eventData.source = box;                    $(this).click(menu.eventData, menu.click);                    $(this).click(menu.eventData, function () {                        $menuBox.hide();                    });                }            });        }        function _documentClick(e) {            var isHide1 = $(e.target).parents("#" + menuId).length;            var isHide2 = $(e.target).parents().andSelf().filter(box).length            if (!isHide1 && !isHide2) {                $menuBox.hide();                $(document).unbind("click", documentClick);            }        }    };    function _buildMenu(options) {        var $menuBox = $("#" + menuId);        if ($menuBox.length) {            $menuBox.remove();        }        $menuBox = $("<div/>").attr("id", menuId);        var $ul = $("<ul/>").appendTo($menuBox);        for (var i in options.menus) {            var menu = options.menus[i];            $("<li/>").appendTo($ul).html(menu.name);        }        var pointX = options.left + 15;        var pointY = options.top + 15;        $menuBox.css({left:pointX, top:pointY});        $("body").append($menuBox);        return $menuBox;    }    $.fn.extend({        rightMenu:function (options) {            var _options = {which:3, menus:[], left:0, top:0};            options = $.extend(_options, options);            this.each(function () {                new $.rightMenu(this, options);            });            return this;        }    });})(jQuery);
0 0