Heim > Artikel > Web-Frontend > JS implementiert Countdown (Tage, Stunden, Minuten, Sekunden)

JS implementiert Countdown (Tage, Stunden, Minuten, Sekunden)

高洛峰Original: 2016-12-06 15:42:092272Durchsuche

Das Beispiel in diesem Artikel analysiert den detaillierten Prozess der Countdown-Implementierung in JS als Referenz. Der spezifische Inhalt ist wie folgt

Hinweis:
Die Funktion parseInt() kann eine Zeichenfolge analysieren und eine zurückgeben ganze Zahl.
Syntax:
parseInt(string, radix)

Beispiel:

parseInt("10"); //返回 10
parseInt("19",10); //返回 19 (10+9)
parseInt("11",2); //返回 3 (2+1)
parseInt("17",8); //返回 15 (8+7)
parseInt("1f",16); //返回 31 (16+15)
parseInt("010"); //未定：返回 10 或 8

Implementieren des Countdown-Codes

HTML-Code:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" >
<title>JS实现倒计时(天数,时,分,秒)</title>
  
</head>
<body onload="leftTimer()">
  
<h2>剩余时间:</h2>
<div id="timer"></div>
</body>
</html>

Javascript-Code:

<script language="javascript" type="text/javascript">
function leftTimer(year,month,day,hour,minute,second){
 var leftTime = (new Date(year,month-1,day,hour,minute,second)) - (new Date()); //计算剩余的毫秒数
 var days = parseInt(leftTime / 1000 / 60 / 60 / 24 , 10); //计算剩余的天数
 var hours = parseInt(leftTime / 1000 / 60 / 60 % 24 , 10); //计算剩余的小时
 var minutes = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟
 var seconds = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数
 days = checkTime(days);
 hours = checkTime(hours);
 minutes = checkTime(minutes);
 seconds = checkTime(seconds);
 setInterval("leftTimer(2016,11,11,11,11,11)",1000);
 document.getElementById("timer").innerHTML = days+"天" + hours+"小时" + minutes+"分"+seconds+"秒";
}
function checkTime(i){ //将0-9的数字前面加上0，例1变为01
 if(i<10)
 {
  i = "0" + i;
 }
 return i;
}
  
</script>

Erkenntniseffekt:

JS implementiert Countdown (Tage, Stunden, Minuten, Sekunden)

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：Entfernung und Beibehaltung von Iframe-Bildlaufleisten in JavaScriptNächster Artikel：Entfernung und Beibehaltung von Iframe-Bildlaufleisten in JavaScript

In Verbindung stehende Artikel

Mehr sehen