Maison  >  Article  >  interface Web  >  Comment implémenter les bases des compteurs en JavaScript

Comment implémenter les bases des compteurs en JavaScript

黄舟
黄舟original
2017-10-11 10:18:293475parcourir

Cet article présente principalement en détail la méthode de base d'implémentation des compteurs en JavaScript. , a une certaine valeur de référence, les amis intéressés peuvent s'y référer

L'exemple dans cet article partage le code spécifique pour implémenter le compteur en js pour votre référence. Le contenu spécifique est le suivant

En utilisant JavaScript, il exécute le code après un intervalle défini, plutôt qu'immédiatement après l'appel de la fonction. Appelez cela un événement de timing.

Il est très simple d'utiliser des événements de synchronisation en JavaScript. Les deux méthodes clés sont :

setInterval() - exécute l'événement spécifié en continu au nombre de millisecondes spécifié. .
setTimeout() - Exécute le code spécifié après une pause pendant le nombre de millisecondes spécifié

Remarque : setInterval() et setTimeout() sont deux méthodes de l'objet HTML DOM Window. Seule la méthode setTimeout() est présentée ici ;


<!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>

Effet :

Cliquez pour start Le comptage commencera à partir de 0. Si vous arrêtez le chronométrage, il s'arrêtera à ce moment-là. Si vous cliquez à nouveau sur Démarrer, il continuera à compter... Mais ce programme a un petit bug lorsque vous continuez à cliquer pour démarrer le chronométrage. , la vitesse de synchronisation augmentera et cliquer une fois pour arrêter la minuterie ne s'arrêtera pas, il faudra plusieurs clics pour s'arrêter.....

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn