我想使用 setInterval 来制作一些动画。首先,我希望能够指定一系列页面元素,并让它们设置它们的背景颜色,这些颜色会逐渐淡出。一旦颜色恢复正常,就不再需要计时器了。
所以我有
function setFadeColor(nodes) {
var x = 256;
var itvlH = setInterval(function () {
for (i in nodes) {
nodes[i].style.background-color = "rgb(0,"+(--x)+",0);";
}
if (x <= 0) {
// would like to call
clearInterval(itvlH);
// but itvlH isn't in scope...?
}
},50);
}
使情况更加复杂的是我希望能够有多个这种情况发生。我在想,也许我会把实时间隔处理程序插入一个数组,并在它们“死掉”时清理它们,但我怎么知道它们什么时候死了?只有在间隔闭包内我才真正知道它何时结束。
如果有一种方法可以从闭包中获取间隔的句柄,那将会有所帮助。
或者我可以做这样的事情?
function intRun() {
for (i in nodes) {
nodes[i].style.background-color = "rgb(0,"+(--x)+",0);";
}
if (x <= 0) {
// now I can access an array containing all handles to intervals
// but how do I know which one is ME?
clearInterval(itvlH);
}
}
var handlers = [];
function setFadeColor(nodes) {
var x = 256;
handlers.push(setInterval(intRun,50);
}
最佳答案
你的第一个例子会很好用 ^_^
function setFadeColor(nodes) {
var x = 256;
var itvlH = setInterval(function () {
for (i in nodes) {
nodes[i].style.background-color = "rgb(0,"+(--x)+",0);";
}
if (x <= 0) {
clearInterval(itvlH);
// itvlH IS in scope!
}
},50);
}
你测试过吗?
关于javascript - 使用 setInterval 创建一个可以自行清理的计时器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7689322/