純javascript實現(xiàn)的倒計時插件,具體代碼如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<p class="txt-p">
<span>剩余:</span>
<span id="RemainD" class="t">0</span>
<span class="txt">天</span>
<span id="RemainH" class="t">0</span>
<span class="txt">小時</span>
<span id="RemainM" class="t">0</span>
<span class="txt">分</span>
<span id="RemainS" class="t">0</span>
<span class="txt">秒</span>
</p>
<script type="text/javascript">
var StartTime = new Date('2013/9/6 23:26:00');//開始時間
var EndTime = new Date('2013/9/7 23:00:00');//結(jié)束時間
var NowTime_Server = new Date('2013/9/6 23:42:55');//服務(wù)器時間
var NowTime_Client = new Date();//客戶端時間
var param = NowTime_Client - NowTime_Server;//客戶端和服務(wù)器時間校準參數(shù)
var timer;
function SetTime(_time) {
var nD, nH, nM, nS;
nD = Math.floor(_time / (1000 * 60 * 60 * 24));
nH = Math.floor(_time / (1000 * 60 * 60)) % 24;
nM = Math.floor(_time / (1000 * 60)) % 60;
nS = Math.floor(_time / 1000) % 60;
document.getElementById("RemainD").innerHTML = nD;
document.getElementById("RemainH").innerHTML = nH;
document.getElementById("RemainM").innerHTML = nM;
document.getElementById("RemainS").innerHTML = nS;
}
function GetRemainTime() {
var NowTime = new Date();
NowTime.setTime(NowTime.getTime() - param);//客戶端和服務(wù)器時間校準
var nMS = NowTime - StartTime;
var eMS = EndTime - NowTime;
if(nMS > 0 && eMS > 0){
SetTime(eMS);
} else if(nMS < 0) {
console.log('還未開始');
}else if(eMS < 0){
console.log('已經(jīng)結(jié)束');
SetTime(0);
return;
}
timer = setTimeout("GetRemainTime()", 1000);
}
GetRemainTime();
</script>
</body>
</html>
更多信息請查看IT技術(shù)專欄