JavaScript：如何將對象作爲參數傳遞給addEventListener函數？

我的JavaScript代碼如下所示JavaScript：如何將對象作爲參數傳遞給addEventListener函數？

$.getJSON("sample_json.json", function(data) { 
    //javascript object 
    var someId = data['item'][0]['id']; 
    console.log("Outside addEventListener "+someId); 

    //create <tr> element 
    var tr = document.createElement('tr'); 

    //bind click event 
    tr.addEventListener("click",function() { 
    console.log("inside addEventListener "+someId); 
    someFunction(someId); 
    },false);  
}); 

//function 
function someFunction(someId){ 
    console.log("Inside someFunction "+someId); 
}

現在，當我<tr>元素上單擊給輸出

Outside addEventListener 150 
Inside addEventListener 1 
Inside someFunction 1

下面當我改變someId作爲

var someId = 150;

它完美

Outside addEventListener 150 
Inside addEventListener 150 
Inside someFunction 150

我應該在JavaScript代碼中更改以獲取javascript對象上的實際id對click事件嗎？

注意：我已經提到堆棧溢出現有的問題。 How to pass arguments to addEventListener listener function? 但沒有多大幫助。

編輯：更新的JavaScript代碼與一些jQuery的功能，從JSON文件創建data JavaScript對象。

來源

2017-10-04 Pankaj

沒有我的數據對象沒有修改任何地方。 – Pankaj

此代碼_should_ work –

不是傳遞對象作爲參數的，我會建議你使用data-attribute

$.getJSON("sample_json.json", function(data) { 
    //javascript object 
    var someId = data['item'][0]['id']; 
    console.log("Outside addEventListener "+someId); 

    //create <tr> element 
    var tr = document.createElement('tr'); 

    tr.setAttribute('data-someId', someId); 

    //bind click event 
    $('tr').on("click",function() { 
    console.log("inside addEventListener "+$(this).data('someId')); 
    someFunction($(this).data('someId')); 
    },false);  
}); 

//function 
function someFunction(someId){ 
    console.log("Inside someFunction "+someId); 
}

希望這會幫助你。

來源

2017-10-04 08:54:51 Shiladitya

是的，這有幫助。非常感謝@Shiladitya – Pankaj

@Pankaj歡迎哥們:)。請接受答案。 – Shiladitya

也許你稍後在程序中將someId更改爲1，這就是爲什麼它的事件處理程序打印1而不是150. 如果圍繞事件處理函數創建閉包，可以將someId綁定到它在事件處理函數創建的時間（150）。您可以創建一個閉包是這樣的：

tr.addEventListener("click",(function(someId) 
{ 
    return function() { 
    console.log("inside addEventListener "+someId); 
    someFunction(someId); 
    } 
})(someId),false);

來源

2017-10-04 07:21:59

JavaScript：如何將對象作爲參數傳遞給addEventListener函數？

回答

相關問題