이 기사에서는 스마트 오른쪽 클릭 메뉴를 소개합니다. 가져와야 하는 파일은 기사 마지막 부분에 나와 있습니다.
구체적인 코드는 다음과 같습니다.
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')는 마우스 오른쪽 버튼 클릭 라벨을 지정하는데, 이는 실제 상황에 따라 결정해야 하므로 테이블 헤더에 추가하는 것이므로 1번째 라벨입니다
e. which = 3은 마우스 오른쪽 버튼 클릭을 의미합니다
여기에는 두 가지 상황이 나열되어 있습니다
하나는 메뉴의 콘텐츠를 결정하는 것입니다. 이전 작업을 사용하여 고유한 마우스 오른쪽 버튼 클릭 메뉴의 이름을 정의합니다.
다른 하나는 확실하지 않습니다. 서버에서 데이터를 가져와서 배열에 저장할 수 있습니다. 여기서는 열심히 작성한 다음 클로저를 사용해야 하는 두 번째 방법을 사용합니다.
가져올 파일: http://download.csdn.net/detail/u012116457/9449905
위 내용은 자바스크립트 기반의 스마트 오른쪽 클릭 메뉴 구현에 관해 편집자가 공유한 지식입니다. 모든 분들께 도움이 되길 바랍니다!