js+html5 implementiert einen Countdown-Effekt, der auf der Seite aktualisiert werden kann-HTML-Tutorial-php.cn

js+html5 implementiert einen Countdown-Effekt, der auf der Seite aktualisiert werden kann

不言

Freigeben： 2018-06-05 14:38:20

Original

1782 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich den Countdown-Effekt von js+html5 vor, um eine Seitenaktualisierung zu erreichen. Er hat einen gewissen Referenzwert.

Einen 5-Minuten-Countdown geschrieben aktualisiert werden, und dann beginnt der Countdown bei 4:59. Eine Lösung, die ich mir überlegt habe, besteht darin, den Cache zu verwenden, die Start-Countdown-Zeit plus die 5 Minuten für den Countdown als Cache festzulegen und dann direkt diese Cache-Zeit abzüglich der aktuellen Zeit zu verwenden Zählen Sie weiter herunter, egal was Sie während des Countdowns tun, die Zeit wird sich immer ändern, haha, das ist das Prinzip.

<!doctype html>
<html>

  <head>
    <meta charset="utf-8">
    <title>简单易用的倒计时js代码</title>

  </head>

  <body>
    <p id="time"></p>
    <script src="js/jquery-git.js"></script>
    <script>
      localStorage.setItem(&#39;start&#39;, new Date().getTime());
      countDown(localStorage.getItem(&#39;start&#39;));

      function countDown(startTime) {
        var time = setInterval(function() {
          var currentTime = new Date();
          var second = 59 - parseInt(((currentTime.getTime() - startTime) / 1000) % 60);
          var min = 4 - parseInt((currentTime.getTime() - startTime) / 60000);

          if(min < 10) {
            min = "0" + min;
          }
          if(second < 10) {
            second = "0" + second;
          }

          var countDown = min + ":" + second;
          $(&#39;#time&#39;).html(countDown);

          if(second == 0 && min == 0) {
            clearInterval(time);
          }
        }, 1000)
      }
    </script>

  </body>

</html>

Nach dem Login kopieren

Verwandte Empfehlungen:

JavaScript-Implementierung, um Remote-HTML auf die aktuelle Seite zu bringen

Das obige ist der detaillierte Inhalt vonjs+html5 implementiert einen Countdown-Effekt, der auf der Seite aktualisiert werden kann. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!