javascript - Javascript 循环内的事件处理程序 - 需要闭包吗？

Question

我正在使用从其他人那里接管的一些 html 和 Javascript 代码。该页面每十秒重新加载一个数据表(通过异步请求)，然后使用一些 DOM 代码重新构建该表。有问题的代码看起来像这样:

var blah = xmlres.getElementsByTagName('blah');
for(var i = 0; i < blah.length; i++) {
    var td = document.createElement('td');
    var select = document.createElement('select');
    select.setAttribute("...", "...");
    select.onchange = function() {
        onStatusChanged(select, callid, anotherid);
    };
    td.appendChild(select);
}

当 onchange为 <select> 触发事件然而，似乎相同的值被传递给了 onStatusChanged()。每个 <select> 的方法在表中(我已经验证在循环的每次迭代中，callid 和 anotherid 都被赋予了新的、不同的值)。

我怀疑这是因为我设置事件处理程序的方式的性质，使用 select.onchange = function()句法。如果我理解这是如何正常工作的，那么这个语法将 onchange 事件的闭包设置为一个函数，它引用这两个引用，最终的最终值是它们在循环的最后一次迭代中设置的值。当事件触发时，callid 引用的值和 anotherid是上次迭代时设置的值，不是单次迭代时设置的值。

有没有办法可以复制传递给 onStatusChanged() 的参数值？ ？

我更改了标题以更好地反射(reflect)问题和已接受的答案。

Answer 1

你确实需要在这里实现一个闭包。这应该工作(让我知道 - 我没有测试它)

var blah = xmlres.getElementsByTagName('blah');
for(var i = 0; i < blah.length; i++) {
    var td = document.createElement('td');
    var select = document.createElement('select');
    select.setAttribute("...", "...");
    select.onchange = function(s,c,a)
    {
        return function()
        {
            onStatusChanged(s,c,a);
        }
    }(select, callid, anotherid);
    td.appendChild(select);
}