ClearTimeOut()未清除计时器

Question

function countDown(secs,elem)
{   
    var element = document.getElementById(elem);
    element.innerHTML = "Game ends in " + secs + " seconds!";
    if(secs<1)
    {   
        clearTimeout(timer);
        document.getElementById('gameContent').style.display='none';
    }
    secs--;
    var timer = setTimeout('countDown('+secs+',"'+elem+'")',1000);
}
 <div class="timerCount" id="status"></div>
 <script>countDown(5,"status");</script>

我的计时器在5秒钟并减小时正确启动。我的游戏Div在计时器达到0之后隐藏了，但是计时器尚未清除，而结束则为负面。请在我的代码中我的错误，以停止计时器并清除

Answer 1

如果您只使用setInterval并执行这样的操作，则更有效：

function countDown(secs, elem) {
  var interval;
  var element = document.getElementById(elem);
  var timer = setInterval(function() {
    secs--;
    update();
    if (secs < 1) {
      clearInterval(timer);
    }
  }, 1000);
  function update() {
    if (secs > 0) {
      element.innerHTML = "Game ends in " + secs + " seconds!";
    } else {
      document.getElementById('gameContent').style.display = 'none';
    }
  }
  update();
}
countDown(5, "status");

<div id="gameContent">
  <h1>Game</h1>
  <div class="timerCount" id="status"></div>
</div>

Answer 2

清除超时是没有道理的，因为您在回调中被您要清除的超时引用，因此确实没有什么可清除的。即使您将timer声明为全局变量，仍然不会处理该概念问题。

您的问题实际上是您几秒钟用完后仍会致电setTimeout。因此，在这样做之前退出功能(或使用else(：

function countDown(secs,elem)
{   
    var element = document.getElementById(elem);
    element.innerHTML = "Game ends in " + secs + " seconds!";
    if(secs<1)
    {   
        document.getElementById('gameContent').style.display='none';
        return; // <-------- add this!
    }
    secs--;
    // avoid passing string as first argument to setTimeout:
    setTimeout(countDown.bind(null, secs, elem),1000);
}

nb：将字符串作为第一个参数传递给 setTimeout是不好的练习：就像使用eval一样，需要评估该字符串。除了程序员对eval的保留外，在这种情况下，它的效率也不太效率和不必要。