javascript - 如何停止函数再次执行，直到经过特定时间

Question

我有一个函数，它会在您单击按钮时运行。但是我不希望函数在特定时间过去之前再次执行。例如，倒计时结束。如果再次单击该按钮，则该函数不应运行。

$("start").on('click', function() {
  var myTimer;

  function clock() {
    myTimer = setInterval(myClock, 1000);
    var c = 5;

    function myClock() {
      document.getElementById("demo").innerHTML = --c;
      if (c == 0) {
        clearInterval(myTimer);
        alert("Reached zero");
      }
    }
  }
});

Answer 1

首先删除clock()函数。鉴于您的代码结构，它没有任何用处。其次，如果您要使用 jQuery 等框架，请与其保持一致。

要解决实际问题，请存储一个 bool 标志以确定时间是否正在运行。

let $demo = $('#demo');

$("#start").on('click', function() {
  let $button = $(this);
  if ($button.data('running'))
    return; // do nothing

  $button.data('running', true);
  let myTimer = setInterval(myClock, 1000);
  let c = 5;
  $demo.html(c);

  function myClock() {
    $("#demo").html(--c);
    if (c == 0) {
      $button.data('running', false);
      clearInterval(myTimer);
      console.log("Reached zero");
    }
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="start">Start</button>
<div id="demo"></div>