请求动画帧循环

Question

我遇到了这段代码https://gist.github.com/joelambert/1002116 ，我想到了玩它

我试图创建一个循环并停止它

var tick = 0;
var dor = requestInterval(function(){
  tick++;
   console.log("hi", tick)
  if (tick > 10){

     stop();
  }
},300)

function stop(){ 
  console.log("stop")
     clearRequestInterval(dor);
}

但是clearRequestInterval不会清除计时器。 但是，当我尝试从按钮的事件处理程序中调用它时，它的工作原理是。 我想念什么吗？

我已经附上了Codepen http://codepen.io/srajagop/pen/KgbbpR

Answer 1

@Bergi是正确的，因为您尝试使用的示例代码已损坏，它不支持从间隔函数本身内部取消间隔计时器。 您可以通过异步调用clearRequestInterval来解决此问题：

function stop() {
  console.log("stop");
  window.setTimeout(function() {
    clearRequestInterval(dor);
  }, 0);
}

也许更好，您可以修复示例代码，即使它从interval函数中被取消，也不要重新计划自身。