Heim > Artikel > Web-Frontend > So verwenden Sie den Timer, um die Countdown-Funktion in js zu implementieren

So verwenden Sie den Timer, um die Countdown-Funktion in js zu implementieren

php中世界最好的语言Original: 2018-04-16 10:03:573240Durchsuche

Dieses Mal zeige ich Ihnen, wie Sie den Timer verwenden, um die Countdown-Funktion in js zu implementieren. Hinweise zur Verwendung des Timers Die Countdown-Funktion in js Welche davon sind die folgenden praktischen Fälle, werfen wir einen Blick darauf.

Datumsfunktion

Countdown = zukünftige Zeit nutzen - gegenwärtige Zeit

Frage: Die zukünftige Zeit ist 1970 Millisekunden entfernt – die gegenwärtige Zeit ist 1970 Jahre 1

Verwenden Sie die Anzahl der Millisekunden in der Zukunft – die Anzahl der Millisekunden jetzt und konvertieren Sie einfach weiter

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title></title>
 <style>
  body{
   font-size:30px;
   text-align: center;
   color:red;
  }
 </style>
 <script>
  window.onload = function(){
   var demo = document.getElementById("demo");
   var endTime = new Date("2017/11/12 17:30:00"); // 最终时间
   setInterval(clock,1000); // 开启定时器
   function clock(){
    var nowTime = new Date(); // 一定是要获取最新的时间
    // console.log(nowTime.getTime()); 获得自己的毫秒
    var second = parseInt((endTime.getTime() - nowTime.getTime()) / 1000);
    // 用将来的时间毫秒 - 现在的毫秒 / 1000 得到的 还剩下的秒 可能处不断 取整
    // console.log(second);
     // 一小时 3600 秒
    // second / 3600 一共的小时数 /24 天数
    var d = parseInt(second / 3600 / 24); //天数
    //console.log(d);
    var h = parseInt(second / 3600 % 24) // 小时
    // console.log(h);
    var m = parseInt(second / 60 );
    //console.log(m);
    var s = parseInt(second ); // 当前的秒
    console.log(s);
    /* if(d<10)
    {
     d = "0" + d;
    }*/
    d<10 ? d="0"+d : d;
    h<10 ? h="0"+h : h;
    m<10 ? m="0"+m : m;
    s<10 ? s="0"+s : s;
    demo.innerHTML = "距离抢购时间还剩: "+d+"天 "+h+"小时 "+m+"分钟 "+s+"秒";
   }
  }
 </script>
</head>
<body>
<p id="demo"></p>
</body>
</html>

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Bitte achten Sie darauf zu anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Das obige ist der detaillierte Inhalt vonSo verwenden Sie den Timer, um die Countdown-Funktion in js zu implementieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php JS

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：JS-Implementierung des Anwendungsfalls für den BildlupeneffektNächster Artikel：JS-Implementierung des Anwendungsfalls für den Bildlupeneffekt

In Verbindung stehende Artikel

Mehr sehen