fairycat

Created:
Updated:

控制 setInterval() 定时执行任务和停止任务,出现多个定时器同时运行

现需要定时执行一个函数,而且在鼠标光标经过时,停止计时器,当鼠标光标离开时,再次运行定时器。比如,轮播图。

由于代码错误,出现了这样情况:当鼠标光标经过时,停止定时器,鼠标光标离开后,开启了定时器,这第一轮没啥毛病。当鼠标再次经过时,没有成功停止定时器,而且,当鼠标离开好后,有生成新的定时器。多试几次后,轮播图就疯了似的,飞转~

这当然可以想到,新生成的定时器没有能成功的复原,很可能就是作用域的问题了。比如以 jQuery 的 hover 事件为例:

var i = setInterval(next, 1000)
dom.hover(function () {
    clearInterval(i)
}, function () {
    // var i = setInterval(next, 1000); // 别写var,否则clearInterval无法清除它
    i = setInterval(next, 1000);
});

评论

Name

Email

Website

Subject