この記事では、スマートな右クリック メニューについて説明します。インポートする必要があるファイルは、最初にコードを示します。
具体的なコードは次のとおりです:
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') は右クリックラベルを指定します。実際の状況に応じて決定する必要があります。テーブルのヘッダーに追加しているため、
番目のラベルになります。
e.that = 3 は右クリックを意味します
ここには 2 つの状況がリストされています
1 つは、前の操作を使用して、メニューの内容を決定することです。これは一意である必要があります。
もう 1 つは、サーバーからデータを取得して配列に格納する方法です。ここでは、それを一生懸命書いてから、クロージャを使用する 2 番目の方法を使用します。
インポートするファイル: http://download.csdn.net/detail/u012116457/9449905
上記の内容は、JavaScript をベースにしたスマート右クリック メニューの実装について編集者が共有した知識であり、皆様のお役に立てれば幸いです。