JQuery---右键菜单版本二
来源:互联网 发布:vb绘图控件 编辑:程序博客网 时间:2024/06/05 15:33
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
- JQuery---右键菜单版本二
- JQuery---右键菜单版本二
- JQuery---右键菜单版本二
- JQuery---右键菜单版本一
- JQuery---右键菜单版本一
- JQuery---右键菜单版本一
- jQuery无级右键菜单
- jQuery--右键菜单功能
- jquery右键菜单demo
- jquery 右键弹出菜单
- Jquery 右键菜单
- jquery右键菜单1
- jquery右键菜单2
- Jquery 右键菜单
- jquery右键菜单
- jquery 右键菜单 插件
- Jquery 右键菜单
- jQuery右键菜单
- qwt移植到tiny6410
- Xms Xmx PermSize MaxPermSize 区别
- JQuery---右键菜单版本一
- JVM系列三:JVM参数设置、分析
- JQuery---选择年月的插件
- JQuery---右键菜单版本二
- 图---邻接矩阵的深度搜索与广度搜索测试一
- js 获取屏幕各种宽高的方法(浏览器兼容)
- Xms Xmx PermSize MaxPermSize 区别
- DEBUG和RELEASE 版本差异
- JVM系列三:JVM参数设置、分析
- JQuery---长度超出显示省略号
- JQuery---右键菜单版本二
- 图---邻接表的深度搜索与广度搜索测试一