JavaScript中實作計數器基礎的方法-js教程-PHP中文網

JavaScript中實作計數器基礎的方法

黄舟

發布： 2017-10-11 10:18:29

原創

3474 人瀏覽過

這篇文章主要為大家詳細介紹了JavaScript實作計數器的基礎方法，具有一定的參考價值，有興趣的小夥伴們可以參考一下

本文實例為大家分享了js實作計數器的具體程式碼，供大家參考，具體內容如下

#透過使用JavaScript，設定的時間間隔之後會執行程式碼，而不是在函數被呼叫後立即執行。稱為計時事件。

在JavaScritp 中使用計時事件是很容易的，兩個關鍵方法是:

setInterval() - 間隔指定的毫秒數不停地執行指定的代碼。
setTimeout() - 暫停指定的毫秒數後執行指定的程式碼

Note: setInterval() 和 setTimeout() 是 HTML DOM Window物件的兩個方法。這裡只介紹了setTimeout()方法；

<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <script type="text/javascript">
      var c = 0
      var t

      function timedCount() {
        document.getElementById(&#39;txt&#39;).value = c;
        c = c + 1;
        //创建计时器，在指定周期内循环执行
        t = setTimeout("timedCount()", 1000);
      }

      function stopCount() {
        //清除计时器
        clearTimeout(t);
      }
    </script>
  </head>

  <body>

    <form>
      <input type="button" value="开始计时！" onClick="timedCount()">
      <input type="text" id="txt">
      <input type="button" value="停止计时！" onClick="stopCount()">
    </form>



  </body>

</html>

登入後複製

效果：