javascript - 单击或禁用它时重新启动计数器 - Javascript

Question

我有这个 JavaScript 函数，它会倒计时，直到您可以单击下载按钮，但是我希望在单击它后再次禁用或再次开始倒计时，最好禁用。

这是 JavaScript。

<script type="text/javascript">
  x = 10;
  function countdown() {
    if (x > 1) {
      x--;
      document.getElementById("button").innerHTML = x;
      r = setTimeout("countdown()",1000);
    }
    else {
      clearTimeout(r);
      document.getElementById("button").innerHTML = "Click to download";
      document.getElementById("button").disabled = "";
    }
  }
  r = setTimeout("countdown()",1000);

</script>

这是按钮，

<label><font size="5">Your download will start in: </label><a href="download.php?shortURL=<?php echo $fullfile; ?>"><button class="btn orange" id="button" disabled="disabled" onclick="window.location.reload()" >10</button></font></a>

谢谢!

Answer 1

要再次开始倒计时，您只需创建一个函数来清除任何现有计时器并重置计数器变量，然后从按钮的 onclick 事件中调用此函数:

function resetCountdown() {
    clearTimeout(r);
    x = 10;
    countdown();
}

要禁用该按钮，您可以将其设置为禁用:

document.getElementById("button").disabled = "disabled";