setTimeout /clearTimeout problem

2022-08-30 04:39:11

我试图做一个页面去开始页面后,例如。10 秒不活动(用户未单击任何位置)。我使用jQuery进行其余工作,但我的测试函数中的set/clear是纯javascript。

在我沮丧的情况下,我最终得到了类似这个功能的东西,我希望我可以在页面上的任何点击中调用它。计时器启动正常,但单击时不会重置。如果在前 10 秒内调用该函数 5 次,则会出现 5 个警报...没有清除超时...

function endAndStartTimer() {
    window.clearTimeout(timer);
    var timer;
    //var millisecBeforeRedirect = 10000; 
    timer = window.setTimeout(function(){alert('Hello!');},10000); 
}

有没有人得到一些代码行,可以做到这一点?- 在任何点击停止,重置和启动计时器。- 当计时器击中,例如。10秒做点什么。


答案 1

您需要在函数外部声明。否则,您将在每个函数调用上获得一个全新的变量。timer

var timer;
function endAndStartTimer() {
  window.clearTimeout(timer);
  //var millisecBeforeRedirect = 10000; 
  timer = window.setTimeout(function(){alert('Hello!');},10000); 
}

答案 2

问题在于变量是局部的,并且其值在每次函数调用后都会丢失。timer

你需要持久化它,你可以把它放在函数之外,或者如果你不想把变量公开为全局变量,你可以把它存储在一个闭包中,例如:

var endAndStartTimer = (function () {
  var timer; // variable persisted here
  return function () {
    window.clearTimeout(timer);
    //var millisecBeforeRedirect = 10000; 
    timer = window.setTimeout(function(){alert('Hello!');},10000); 
  };
})();