快捷導(dǎo)航

Javascript 倒計時源代碼.(時.分.秒) 詳細(xì)注釋版

更新時間：2011年05月09日 19:00:53 作者：

基于js的倒計時實現(xiàn)代碼，并有詳細(xì)的注釋比較適合學(xué)習(xí)使用。

隨便寫寫！閑著無聊！代碼如有bug之處歡迎閣下強力拍磚！
JS CODE

 
<script type="text/javascript" language="javascript"> 
//總時間，已分為單位 
var time = 100; 
//小時 
var h = parseInt(time / 60) > 0 ? parseInt(time / 60) : 0; 
//分 
var m = time % 60; 
//秒 
var s = 60; 
//輸出到當(dāng)前Script的Dom位置 
document.write('<span>剩余<font id="f_hh">' + h + '</font>小時<font id="f_mm">' + m + '</font>分<font id="f_ss">' + s + '</font>秒</span>'); 
//開始執(zhí)行倒計時 
var timeInterval = setInterval(function () { 
//如果時、分、秒都為0時將停止當(dāng)前的倒計時 
if (h == 0 && m == 0 && s == 0) { clearInterval(timeInterval); return; } 
//當(dāng)秒走到0時，再次為60秒 
if (s == 0) { s = 60; } 
if (s == 60) { 
//每次當(dāng)秒走到60秒時，分鐘減一 
m -= 1; 
//當(dāng)分等于0時并且小時還多余1個小時的時候進(jìn)里面看看 
if (m == 0 && h > 0) { 
//小時減一 
h -= 1; 
//分鐘自動默認(rèn)為60分 
m = 60; 
//秒自動默認(rèn)為60秒 
s = 60; 
} 
} 
//秒繼續(xù)跳動，減一 
s -= 1; 
//小時賦值 
document.getElementById('f_hh').innerHTML = h; 
//分鐘賦值 
document.getElementById('f_mm').innerHTML = m; 
//秒賦值 
document.getElementById('f_ss').innerHTML = s; 
}, 1000); 
</script> 

HTML CODE

復(fù)制代碼代碼如下:

 
<html> 
<head> 
<title>Date Demo</title> 
</head> 
<body> 
<script type="text/javascript" language="javascript"> 
//總時間，已分為單位 
var time = 100; 
//小時 
var h = parseInt(time / 60) > 0 ? parseInt(time / 60) : 0; 
//分 
var m = time % 60; 
//秒 
var s = 60; 
//輸出到當(dāng)前Script的Dom位置 
document.write('<span>剩余<font id="f_hh">' + h + '</font>小時<font id="f_mm">' + m + '</font>分<font id="f_ss">' + s + '</font>秒</span>'); 
//開始執(zhí)行倒計時 
var timeInterval = setInterval(function () { 
//如果時、分、秒都為0時將停止當(dāng)前的倒計時 
if (h == 0 && m == 0 && s == 0) { clearInterval(timeInterval); return; } 
//當(dāng)秒走到0時，再次為60秒 
if (s == 0) { s = 60; } 
if (s == 60) { 
//每次當(dāng)秒走到60秒時，分鐘減一 
m -= 1; 
//當(dāng)分等于0時并且小時還多余1個小時的時候進(jìn)里面看看 
if (m == 0 && h > 0) { 
//小時減一 
h -= 1; 
//分鐘自動默認(rèn)為60分 
m = 60; 
//秒自動默認(rèn)為60秒 
s = 60; 
} 
} 
//秒繼續(xù)跳動，減一 
s -= 1; 
//小時賦值 
document.getElementById('f_hh').innerHTML = h; 
//分鐘賦值 
document.getElementById('f_mm').innerHTML = m; 
//秒賦值 
document.getElementById('f_ss').innerHTML = s; 
}, 1000); 
</script> 
</body> 
</html> 