Wie erstelle ich einen einfachen Countdown-Timer nur mit JavaScript?-js-Tutorial-php.cn

Wie erstelle ich einen einfachen Countdown-Timer nur mit JavaScript?

Mary-Kate Olsen

Freigeben： 2024-12-03 22:31:16

Original

521 Leute haben es durchsucht

How to Create a Simple Countdown Timer Using Only JavaScript?

Erstellen eines einfachen Countdown-Timers in JavaScript

Wenn Sie einen unkomplizierten Countdown-Timer für Ihre Website einrichten möchten, einen, der elegant von „05:00“ zu „ 00:00“, suchen Sie nicht weiter. Dieser Artikel bietet eine optimierte Lösung, die auf komplexe Datumsobjekte verzichtet und größtmögliche Einfachheit gewährleistet.

Nur JavaScript-Timer

function startTimer(duration, display) {
  var timer = duration, minutes, seconds;
  setInterval(function () {
    minutes = parseInt(timer / 60, 10);
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + ":" + seconds;

    if (--timer < 0) {
      timer = duration;
    }
  }, 1000);
}

window.onload = function () {
  var fiveMinutes = 60 * 5,
    display = document.querySelector('#time');
  startTimer(fiveMinutes, display);
};

Nach dem Login kopieren

HTML-Struktur:

<body>
  <div>Registration closes in <span>

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie erstelle ich einen einfachen Countdown-Timer nur mit JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Wie erstelle ich einen einfachen Countdown-Timer nur mit JavaScript?

Erstellen eines einfachen Countdown-Timers in JavaScript

Nur ​​JavaScript-Timer

HTML-Struktur:

Nur JavaScript-Timer