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函数？

回答

相关问题