如何在循环中设置onclick属性

Question

我正在构建一个表格，第一列中有文字，第二列中有东西。这里是完整的.js文件：

var table = document.createElement("table"); 
var tableBody = document.createElement("tbody"); 

for(i = 0; i < array.length; i++) { 

var row = table.insertRow(i); 
var cell = row.insertCell(0); 
cell.innerHTML = text[i]; 

var cell = row.insertCell(1); 
var cellElement = document.createElement("input"); 
cellElement.setAttribute("id", ID[i]); 
cellElement.setAttribute("type", "button"); 
cellElement.setAttribute("value", "button"); 

/////cellElement.onclick = 
    /////function(){ doThisThing(i,ID[i]); }); 

cell.appendChild(cellElement); 
row.appendChild(cell); 

} 

table.appendChild(tableBody); 

document.body.appendChild(table); 

除了cellEllement.onclick = function（）{}; onlick（）函数没有设置。我曾试过这方面的变化：

cellElement.setAttribute("onclick",doThisThing(i,ID[i])); 

如何设置按钮onclick属性时循环创建表？

Answer 1

您正在使用对函数内部i变量的引用，该变量将继续随着循环而改变，并且不会保留当您执行该循环的迭代时所具有的值i。你需要留住的i电流值，可能是在另一个函数来包装一下你的回调：

cellElement.onclick = (function(currI) { 
    return function() { doThisThing(currI, ID[currI]); }; 
})(i); 

你也可以使用bind，使事情变得更简单：

cellElement.onclick = doThisThing.bind(null, i, ID[i]);