여러 항목을 상황에 맞는 메뉴 추가

Question

DOM 요소의 데이터를 기반으로 마우스 오른쪽 버튼을 클릭 할 때 상황에 맞는 메뉴를 사용하고 있습니다.

는 그것의 자바 스크립트 코드는 : 잘 작동

$(function(){ 

    $('.context-menu-one').on('contextmenu', function(e){ 

     var data = $("#strngTitle").text(); 
     $.contextMenu({ 
      selector: '.context-menu-one', 
      items: { 

       data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
      } 
     }); 

    }); 
}); 

입니다. 는하지만

$('.context-menu-one').on('contextmenu', function(e){ 

    var data = $("#strngTitle").text(); 
    $.contextMenu({ 
     selector: '.context-menu-one', 
     items: 
      for (var i = 0; i < 2; i++) { 

       { 

        data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
       } 
      } 
    }); 

}); 

그것이

items: { 
     data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } }, 
     data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } }, 
    } 

을 :: 형성해야 의미 상황에 맞는 메뉴 항목을 그래서 시도보다 1 시간 :: 보여주고 싶어하지만 난에 for 루프를 사용할 수 없습니다입니다 이. 어떻게 할 수 있습니까?

Answer 1

항목의 매개 변수 유형은 개체입니다.

http://medialize.github.io/jQuery-contextMenu/docs.html

이보십시오.

$('.context-menu-one').on('contextmenu', function(e){ 
    var data = $("#strngTitle").text(); 
    $.contextMenu({ 
     selector: '.context-menu-one', 
     items: { 
      data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
      data2: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
      data3: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
     } 
    }); 
}); 

업데이트 됨.

다음 코드는 object를 의미합니다. 코드에서

{} 

"데이터"개체의 핵심이다 다음, 다음 코드는 사용할 수 없습니다.

{ 
    data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
    data: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
} 

왜 루프를 사용 하시겠습니까 ???

다른 컨텍스트 메뉴를 원한다면 같은 역할을해야합니다. 시도해보십시오.

var dataObjectValue 
    ={ name: data, callback: function (key, opt) { alert("Clicked on " + data); } }; 

var dataObjectForItems={}; 

for(var i=0; i<2; i++){ 
    dataObjectForItems["data"+i]=dataObjectValue; 
} 

// result expected of dataObjectForItems 
//{ 
// data1: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
// data2: { name: data, callback: function (key, opt) { alert("Clicked on " + data); } } 
//} 

$('.context-menu-one').on('contextmenu', function(e){ 
    var data = $("#strngTitle").text(); 
    $.contextMenu({ 
     selector: '.context-menu-one', 
     items: dataObjectForItems 
    }); 
}); 

Answer 2

기본적으로 자바 스크립트에서 개체를 만들 수 없습니다. for-loop는 값의 배열을 생성하지 않으며 객체를 생성하지도 않습니다. 필요한 것은 컨텍스트 메뉴 초기화 호출에 값으로 전달하기 전에 객체를 만드는 것입니다.

var menuItems = {}; 
for (var i = 0; i < 2; i++) { 
    var key = GenerateKey(i); 
    var data = GenerateData(); 
    menuItems[key] = data; 
}; 
$.contextMenu({ 
    selector: '.context-menu-one', 
    items: menuItems 
}); 

function GenerateKey(index) { 
    return "data" + index; 
} 
function GenerateData(index) { 
    return { name: index, callback: function (key, opt) { alert("Clicked on " + index); } }; 
}