在函数中重置 setInterval，范围是全局的..？答案

【问题标题】：resetting setInterval in a function, scope is global..?在函数中重置 setInterval，范围是全局的..？
【发布时间】：2011-07-13 08:04:29
【问题描述】：

问题：当我在函数中声明 clearInterval()/setInterval() 或 clearTimeout()/setTimeout() 时，它什么也不做。我必须重置它的原因是用户可以点击重置计时器。

我尝试过的：我想要一个函数每 3 秒执行一次（因此我使用 setInterval() 与 setTimeout()），并在点击时重置该计时器。我尝试使用 setTimeout()，方法是在每次执行函数时将其 clearTimeout() 和 setTimeout() 放在末尾。结果：执行一次。

以下代码与 setInterval 相同。结果：它循环并且从不重置。

// Declare variables as global
var varTimerSpeed = 3000;
var varTimerInterval;
varTimerInterval = setInterval("someFunction()", varTimerSpeed);

function someFunction() {
  // Reset timer
  clearInterval(varTimerInterval);
  varTimerInterval = setInterval("someFunction()", varTimerSpeed);
}

// Call the function
$(".class").live("click",function() { someFunction(); });

我在 someFunction() 中还有其他可以正常执行的事情，所以我知道 click 的处理程序正在工作。

【问题讨论】：

虽然没有在答案中提到但肯定毫无价值，但应该养成为计时器函数传递对函数的引用的习惯，而不是字符串。
在循环中使用 setTimeout 而不是 setInteval。 stackoverflow.com/questions/5479762/…
“重置计时器”是什么意思？你的意思是“停止计时器”？因为您的示例代码和两个答案已经清楚地发布（即停止），然后立即重新启动计时器，这似乎有点毫无意义。（在计时器调用的函数中这样做似乎更奇怪，但这是理解“重置”的意思的次要问题。）

标签： javascript jquery settimeout setinterval

【解决方案1】：

如果您希望someFunction 以间隔运行，但在单击.class 元素时将其清除并重置，则不要清除someFunction 内的间隔。

只需在点击处理程序中清除并重新启动它。

var varTimerSpeed = 3000;
var varTimerInterval = setInterval(someFunction, varTimerSpeed);

function someFunction() {
  console.log( "someFunction" );
}

$(".class").live("click",function() { 
    clearInterval( varTimerInterval );
    varTimerInterval = setInterval(someFunction, varTimerSpeed);
});

【讨论】：

【解决方案2】：

这个稍作修改的 jsFiddle 似乎可以正常工作：http://jsfiddle.net/jfriend00/GgQBu/。

// Declare variables as global
var varTimerSpeed = 3000;
var varTimerInterval = setInterval(someFunction, varTimerSpeed);

function someFunction() {
    // Reset timer
    $("#output").append("...");
    clearInterval(varTimerInterval);
    varTimerInterval = setInterval(someFunction, varTimerSpeed);
}

// Call the function
$(".class").live("click", someFunction);

【讨论】：