1. 程式人生 > >JQuery 定時器

JQuery 定時器

首先我們模擬考試時間倒計時,來做一個簡單的小例子。

顯示倒計時DIV容器:

<div style=" padding:5px; font-size:15px; font-weight:bold; color:#E00; text-align:center; display: none;">
    倒計時:<span id="timer"> </span>
</div>

Js程式碼: 

        var maxtime = 10 * 60;//考試時間假設為10分鐘
	function CountDown() {
		if (maxtime >= 0) {
			minutes = Math.floor(maxtime / 60);//剩餘分鐘
			seconds = Math.floor(maxtime % 60);//剩餘秒
			msg = minutes + "分" + seconds + "秒";
			document.all["timer"].innerHTML = msg;
			if(maxtime==5*30){
				alert("注意,還有5分鐘啦!");
			} 
			--maxtime;
		} else {
			clearInterval(timer);
			alert("時間到,考試結束!");
		}
	}
	timer = setInterval("CountDown()", 1000);//每個一秒重新整理頁面倒計時間