JavaScript 中的 setTimeout

Question

我正在使用以下代码对 javascript 中的某个过程进行动画处理：

  var direction = $('#rightControl');
  function animate()
  {
      if (hover) return;

      if (!direction.is(':visible'))
      {
          if (direction.attr('id') == 'rightControl') direction = $('#leftControl');
          else direction = $('#rightControl');
      }

      doMove(direction);
  }

  // Animate slider!
  setInterval(animate, 2500);

直到元素 #rightControl 存在于页面：每 2.5 秒调用 animate() 函数并移动我的 div（在 >doMove）。当 #rightControl 消失时，我将方向更改为 #leftControl，...

一切都很好，但是当页面在后台运行一段时间（例如，4-5 分钟） ），动画变得疯狂，每次调用100-200毫秒。怎么了？

Answer 1

嗯，setInterval 只是每隔 * 秒向调用堆栈添加一些内容。如果某些 JavaScript 执行了几秒钟，调用堆栈上可能会出现一些情况。我猜如果页面也在后台，这种情况也可能发生。检查它是否与 setTimeouts 一起使用（因此 1 或函数调用来启动它，1 在函数末尾）。

Answer 2

我可以猜测的是，要么 setInterval() 在别处被意外调用，要么 animate() 被意外调用。

试试这个小提琴： http://jsfiddle.net/fXJbW/
仅使用 animate() 和 setInterval() 即可正常工作。问题出在你的代码的其余部分。

您可以做的另一件事是：

var timeout;

function animate()
{
    // do stuff here
    clearTimeout(timeout);
    timeout=setTimeout(animate,2500);
}