基于JavaScript实现智能右键菜单
通过本文给大家介绍智能右键菜单,需要引入的文件再文末会给出,先给大家展示下代码:
具体代码如下所示:
varcityArray=newArray(); cityArray.push("北京"); cityArray.push("上海"); //设置表头的鼠标右击事件 $('th').mousedown(function(e){ varselected=e.target.innerHTML; //3表示右键 if(e.which==3){ if(selected=="订票类型"){ varopertion={ name:"订票类型" }; vardata=[[{ text:'出票', func:function(){ alert("出票"); } }],[{ text:'留票', func:function(){ alert("留票"); } }],[{ text:'改签', func:function(){ alert("改签"); } }],[{ text:'退票', func:function(){ alert("退票"); } }],[{ text:'全部', func:function(){ alert("全部"); } }]]; $(this).smartMenu(data,opertion); }elseif(selected=="出发城市"){ varopertion={ name:"出发城市" }; vardata=[]; for(vari=0;i<cityArray.length;i++){ //使用闭包 (function(i){ func=function(){ alert(cityArray[i]); } })(i); varobj={ text:cityArray[i], func:func }; varcArray=newArray(); cArray.push(obj); data.push(cArray); } varother={ text:"全部", func:function(){ alert("全部"); } } varotherArray=newArray(); otherArray.push(other); data.push(otherArray); $(this).smartMenu(data,opertion); } } returnfalse;//阻止链接跳转 });
$('th')指定加右键的标签,根据实际来确定我这里是加在表格的表头上,所以是th标签
e.which=3表示是右键
这里列出了两种情况
一种是菜单上的内容确定用前面一种opertion定义该右键菜单的名称,要唯一
另一种是不确定可以通过从服务端获取数据,存储在数组中,我这里写死了,然后用第二种方式实现其中需要用到闭包
需要引入的文件:http://download.csdn.net/detail/u012116457/9449905
以上内容是小编给大家分享的基于JavaScript实现智能右键菜单的相关知识,希望对大家有所帮助!