clearInterval无法正常工作

Question

这很可能只是我的挫折语法错误。但resizeTime只是不清楚。无论多次使用clearInterval，计时器都会继续运行。有什么想法吗？我发布了我的真实代码：

  var resizeTime; // declared outside of wrapper function to INSURE no second declaration will occur
  var myTransitionEvent = whichTransitionEvent();

  $(window).bind('adapt', function(){
        console.log('start', resizeTime);
        resizeTime = setInterval(function(){
              console.log('go', resizeTime);
              methods.relayoutChildren.apply(self);
        }, 5);
        setTimeout(function(){
        console.log('sNend', resizeTime);
              clearInterval(resizeTime);
        },1000);

  });

  $('#allies-wrap').bind(myTransitionEvent, function(){
        console.log('end', resizeTime);
        clearInterval(resizeTime);
        methods.relayoutChildren.apply(self);
  });

以下是chrome的示例日志：

  start undefined
  start 8215
  (10) go 8218
  start 8218
  start 8221
  (256) go 8224
  (2) sNend 8224
  (9) go 8224
  sNend 8224
  (3) go 8224
  sNend 8224
  (2596) go 8224

对于那些不知道chrome日志的人，（2596）表示2596次出现相同的日志。

Answer 1

我认为转化事件未被触发，但adapt事件会一次又一次地被触发。因此resizeTime在活动清除之前发生了变化。 您可以通过在设置新间隔之前清除间隔来修复它（至少使其更好）。

clearInterval(resizeTime);
resizeTime = setInterval(function(){
                  console.log('go', resizeTime);
                  methods.relayoutChildren.apply(self);
            }, 5);

clearTimeout(sNendTime);
sNendTime = setTimeout(function(){
              console.log('sNend', resizeTime);
              clearInterval(resizeTime);
        },1000);

编辑：

会发生什么

1. adapt事件触发器
2. 设置新的时间间隔，并将时间间隔ID分配给resizeTime
3. 设置新超时
4. 所以现在有2件事情是活跃的 - 1间隔，1超时
5. 在超时延迟过去之前，再次adapt事件触发
6. 设置新的时间间隔，并将时间间隔ID分配给resizeTime
7. 当resizeTime被覆盖时，前一个间隔的ID将丢失，但该间隔仍然有效
8. 设置新超时
9. 所以现在4件活动 - 2个间隔，2个超时
10. 继续
11. 1000秒后，说有20个间隔，20个超时活动
12. 第一次出来调用该函数并清除resizeTime
的第20个值指向的间隔
13. 所以仍有19个间隔和19个超时活动
14. 继续
15. 即使transitionevent触发，它也只会清除最新的间隔

要使代码生效，每个transitionevent事件后应该有adapt，但没有。因此，我们必须清除活动间隔和活动超时，以便每次只有一个活动，并且当超时结束时，函数也会清除间隔。