javascript-将.onClick赋予表中的每个单元格

我有一个问题-我想在创建动态生成表的每个单元格时添加一个.onClick事件

cell.onclick = function(){                
        mouseClick(row_number,i, cell);                               
    };

但是，事件似乎只是添加到每行的最后一个单元格中。怎么可能呢？它是否以某种方式超越了之前的那些？如何让它工作

function drawRow(rowData, length, keys, row_number){   
 //rowData - object where the row data is stored, length-row length, keys - object with table keys stored, row_number - number of the row
    var rowData=rowData;
    var row = document.createElement("tr");    
    for(i=0; i<length; i++){    
        var cell = document.createElement("td");
        console.log("Creating event for "+i+" .");
        cell.onclick = function(){                
            mouseClick(row_number,i, cell);                               
        };
        var key = keys[i];       
        var cell_text = document.createTextNode(rowData[key]);        
        cell.appendChild(cell_text);
        row.appendChild(cell);
    }  
    return row;
}

函数drawRow（行数据、长度、键、行编号）{
//rowData-存储行数据的对象，长度行长度，键-存储表键的对象，行编号-行编号
var rowData=rowData；
var行=document.createElement（“tr”）；
对于（i=0；i您看到了JavaScript领域中最常见的问题之一

直到for循环完成后，才会调用onclick函数。当for循环完成时，
i
的值是
length
的值。只有这样，您才会尝试读取它。换句话说，您的每个回调都会

function () {mouseClick(row_number, i, cell}

最后执行回调时，
i
的值是它的最后一个值

如果您正在使用ES6，请改为编写

for (let i=0; i<length; i++)

这将在循环的每个点为每个回调函数提供一个
i
的副本。第一次通过循环时，
i
的值为0，得到的回调为

function () {mouseClick(row_number, 0, cell}

循环的第二次迭代产生

function () {mouseClick(row_number, 1, cell}

等等

非常酷…但是ES6方式与
let
做了同样的事情，稍微好一点

（或者，也可以通过数组上的
forEach
方法来实现这一点。这些方法还可以确保循环迭代不共享索引变量。）
欢迎来到非常不方便的闭包世界；
i
具有全局范围（据我所知） — （顺便说一句，这是个坏习惯）和
row\u number
和
cell
的作用域是外部函数，因此它们对所有单元格都是相同的。可以，但我强烈建议改为事件委派。这个问题与这个问题重复，请参见这里的答案，以获得一个可能的解决方案，并解释javascripts臭名昭著的循环关闭问题。回答不错Ray-介意再添加一个ES5解决方案吗？ES6还没有完全得到支持，OP很有可能没有使用ES6
function () {mouseClick(row_number, 1, cell}