我是靠谱客的博主 冷艳水杯,这篇文章主要介绍基于JavaScript实现智能右键菜单,现在分享给大家,希望可以做个参考。

通过本文给大家介绍智能右键菜单,需要引入的文件再文末会给出,先给大家展示下代码:

具体代码如下所示:

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
var cityArray = new Array(); cityArray.push("北京"); cityArray.push("上海"); //设置表头的鼠标右击事件 $('th').mousedown(function(e){ var selected = e.target.innerHTML; //3表示右键 if(e.which==3){ if(selected=="订票类型"){ var opertion ={ name : "订票类型" }; var data = [[{ text:'出票', func:function(){ alert("出票"); } }],[{ text:'留票', func:function(){ alert("留票"); } }],[{ text:'改签', func:function(){ alert("改签"); } }],[{ text:'退票', func:function(){ alert("退票"); } }],[{ text:'全部', func:function(){ alert("全部"); } }]]; $(this).smartMenu(data,opertion); }else if(selected=="出发城市"){ var opertion ={ name : "出发城市" }; var data = []; for(var i=0;i<cityArray.length;i++){ //使用闭包 (function(i){ func = function(){ alert(cityArray[i]); } })(i); var obj = { text:cityArray[i], func:func }; var cArray = new Array(); cArray.push(obj); data.push(cArray); } var other = { text:"全部", func:function(){ alert("全部"); } } var otherArray = new Array(); otherArray.push(other); data.push(otherArray); $(this).smartMenu(data,opertion); } } return false;//阻止链接跳转 });

$('th') 指定加右键的标签,根据实际来确定 我这里是加在表格的表头上,所以是th标签
e.which = 3 表示是右键

这里列出了两种情况

一种是菜单上的内容确定 用前面一种opertion定义该右键菜单的名称,要唯一

另一种是不确定 可以通过从服务端获取数据,存储在数组中,我这里写死了,然后用第二种方式实现 其中需要用到闭包

需要引入的文件:http://download.csdn.net/detail/u012116457/9449905

以上内容是小编给大家分享的基于JavaScript实现智能右键菜单的相关知识,希望对大家有所帮助!

最后

以上就是冷艳水杯最近收集整理的关于基于JavaScript实现智能右键菜单的全部内容,更多相关基于JavaScript实现智能右键菜单内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(108)

评论列表共有 0 条评论

立即
投稿
返回
顶部