试图设置一个 HTML 类的 innerHTML,它是四个框,每个框依次设置 3 秒。当 innerHTML 设置为加载图标时,我可以在没有 setTimeout 的情况下设置 innerHTML。当将 innerHTML 放入 setTimeout 中时,将返回以下内容:'Uncaught TypeError: Cannot set property 'innerHTML' of undefined'。
尝试调试我的代码,向控制台发送消息并搜索 stackoverflow,但没有成功。
var x = document.getElementsByClassName("numberBox");
for (var i = 0; i < 4; i++) {
x[i].innerHTML= '';
x[i].innerHTML= "<div class='loader'></div>"
}
// function to generate array of 4 random numbers
var randomNums = generateRandomNumbers();
for (var i = 0; i < 4; i++) {
setTimeout(function () {
x[i].innerHTML= '';
x[i].innerHTML = randomNums[i];
}, 3000 * i);
}
想知道为什么我的 innerHTML 不能设置在 setTimeout 内,以及我的问题的可能解决方案。
最佳答案
我认为这是当前范围的问题。 setTimeout 函数创建了它自己的作用域,它没有引用旧变量。您可能需要重新定义超时内的 x 或将数组显式传递给超时。
请参阅此处了解操作方法:How can I pass a parameter to a setTimeout() callback?
我还建议您也阅读闭门器:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures
关于javascript - 无法在 setTimeout 内设置 innerHTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57715671/