月鸟开发日记(1)
本文地址: ()
avatar
作者: FeRookie 类型: 原创
更新时间:2022-05-22 阅读:435

javascript setInterval清除定时器失效

在手写了一个无缝滚动的js 交互效果的时候,需要监听鼠标移入移除事件来控制定时器,所以就用到了setInterval方法,但是在清除定时器的时候出现了问题,定时器清除不了。 正常情况下:

let timer = setInterval(func, 1000)
clearInterval(timer) // 可以清除定时器

但是我的代码如下:

let timer1 = setTimeout(function() {
     clearTimeout(timer1)
    let timer2 = setInterval(func, 1000)
    clearInterval(timer2) // 发现根本移除了不定时器
}, 1000)
// 以为是setTimeout影响了,所以加上了 clearTimeout(timer1)

如上代码: console.log(timer2) // 获得的id值 也是没问题的,可就是清除不了 最后在stackoverflow上面看了一篇文章 说用遍历的方式去移除所有定时器:

let time = {
 timer1: 0,
 timer2: 0
}
time.timer1 = setTimeout(function() {
     clearTimeout(time.timer1)
    time.timer2 = setInterval(func, 1000)
    clearInterval(time.timer2)
}, 1000)
for (var key in time) {
    clearInterval(times[key])
} // 遍历time对象 清除定时器

果真可以了。 引起的原因可能是同时存在多个定时器,清除的时候被混淆了。