这篇文章主要介绍了JQuery右键菜单插件上下文菜单使用指南，需要的朋友可以参考下
插件：
http://www。trendskitchens。co . NZ/jquery/上下文菜单/jquery。上下文菜单。R2。射流研究…
压缩版：
http://www。trendskitchens。co . NZ/jquery/上下文菜单/jquery。上下文菜单。R2。打包好了。射流研究…
Jquery主页：http://jquery.com/
通过此插件可以在不同的超文本标记语言元素内建立上下文菜单，并且可以自定义样式。
复制代码代码如下：
超文本标记语言
头
标题JQuery右键菜单/标题
脚本src= jquery-1。2 .6 .量滴js /脚本
脚本src= jquery。上下文菜单。R2。js /脚本
/头
身体
span class= demo 1 style= color:green；
右键点此
/span
人力资源/
div id=demo2
右键点此
/div
人力资源/
div class=demo3 id=dontShow
不显示
/div
人力资源/
div class=demo3 id=showOne
显示第一项
/div
人力资源/
div class=demo3 id=showAll
显示全部
/div
人力资源/
！-右键菜单的源-
div class=上下文菜单 id=我的菜单1
保险商实验所
Li id=打开 img src=文件夹。巴布亚新几内亚/打开/李
Li id= email img src= email。巴布亚新几内亚/邮件/李
li id=saveimg src=disk.png /保存/李
Li id= delete img src= cross。巴布亚新几内亚/关闭/李
/ul
/div
div class=上下文菜单 id=我的菜单2
保险商实验所
li id=item_1 选项一/李
li id=item_2 选项二/李
li id=item_3 选项三/李
li id=item_4 选项四/李
/ul
/div
div class=上下文菜单 id=我的菜单3
保险商实验所
li id=item_1csdn/li
li id=item_2javaeye/li
li id=item_3itpub/li
/ul
/div
/BODY
脚本
//所有班级为演示一的跨度标签都会绑定此右键菜单
$(span.demo1 ).上下文菜单( myMenu1 ，
{
绑定：
{
打开：函数(t) {
警报(触发器为t.id 操作已打开);
},
电子邮件：功能(t) {
警报(“触发器为t . id n操作为电子邮件");
},
保存：函数(t) {
警报(触发器为t.id 操作已保存);
},
删除：函数(t) {
警报(触发器为t.id 操作为删除’)；
}
}
});
//所有超文本标记语言元素身份证明(识别)为演示2的绑定此右键菜单
$(#demo2 ).上下文菜单( myMenu2 ，{
//菜单样式
menuStyle: {
边框：“2px纯色#000"
},
//菜单项样式
项目样式：{
字体家族：“verdana”，
背景色：绿色，
颜色：白色，
边框："无",
填充：" 1px "
},
//菜单项鼠标放在上面样式
itemHoverStyle: {
颜色：蓝色，
背景颜色：红色，
边框："无"
},
//事件
绑定：
{
item_1 :函数(t) {
警报(触发器为t.id 操作为item _ 1’)；
},
item_2 :函数(t) {
警报(触发器为t.id 操作为item _ 2’)；
},
item_3 :函数(t) {
警报(触发器为t.id 操作为item _ 3’)；
},
item_4 :函数(t) {
警报(触发器为t.id 操作为item _ 4’)；
}
}
});
//所有差异标签班级为演示3的绑定此右键菜单
$(div.demo3 ).上下文菜单( myMenu3 ，{
//重写onContextMenu和展示菜单事件
onContextMenu:函数(e) {
if ($(e.target).attr(id)==dontShow )返回错误的
否则返回真实的
},
onShowMenu: function(e，menu) {
if ($(e.target).attr(id)==showOne) {
$(#item_2，#item_3 ，菜单)。移除();
}
返回菜单；
}
});
/脚本
/HTML
效果图：
很好玩很炫酷的功能吧，小伙伴们自己美化下，加入到自己的项目中去吧
