我正在运行for函数，该函数根据输入的数字动态创建元素。单击div时，我有一个事件侦听器。
这是我用来制作这些按钮的功能。
function createGame(value) {
previousNo = value;
for (i = 0; i < value; i++) {
gameCircle = document.createElement("div");
gameCircle.className = 'gameCircle';
gameCircle.id = "circle" + i;
gameCircle.onclick = function() {
checkGame(i);
};
document.getElementById("circleGame").appendChild(gameCircle);
}
}
这就是我正在调用的函数。
function checkGame(j) {
var nextNo = circleArr.shift();
if (j == nextNo) {
document.getElementById("circle" + i).style.backgroundColor = "#178a00";
} else {
console.log(j);
getValueGame();
}
}
每当函数运行时，它都会返回六个。另外，检查分配的onclick侦听器说它运行此功能。
function () {
checkGame(i);
}
为什么函数在每个按钮上都返回6，为什么i值没有分配给函数？
这是一个年代问题。考虑一下；事件回调要等到以后才执行，到那时，iis的值等于循环结束后一直存在的值value。
解决此问题的最简单方法是将其let用于您的迭代变量，而不是var（对于JavaScript来说，这对于当今的变量来说是个好习惯，而不仅仅是您的情况。）
let“锁定”i循环中遇到的每个闭包的值。该答案将对此进行更详细的讨论。
您可以var通过立即执行的函数表达式（IIFE）将-声明的迭代变量传递给回调范围来达到相同的结果。
gameCircle.onclick = (i => () => checkGame(i))(i);
或者，以更具可读性的术语：
gameCircle.onclick = (function(i) {
return function() { checkGame(i); };
})(i)
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句