1. 程式人生 > >動態時間顯示及倒計時

動態時間顯示及倒計時

JavaScript動態顯示當前時間和倒計時的設計

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文件</title>
<script language="javascript" type="text/javascript">
<!--
//獲得當前時間,刻度為一千分一秒
var initializationTime=(new Date()).getTime();
function showLeftTime()
{
var now=new Date();
var year=now.getYear();
var month=now.getMonth();
var day=now.getDate();
var hours=now.getHours();
var minutes=now.getMinutes();
var seconds=now.getSeconds();
document.all.show.innerHTML="當前時間:"+year+"年"+month+"月"+day+"日"+hours+"小時"+minutes+"分"+seconds+"秒";
//設定結束時間
//1秒=1000毫秒
endTime=initializationTime+60000;
//設定並顯示剩餘時間
var leftTime=endTime-(new Date()).getTime();
if(leftTime>0)
{
   document.all.showLeft.innerHTML=leftTime+"微秒後停止!";
}
else
{
   clearTimeout(timeID);
   document.all.showLeft.innerHTML="TimeOut!";
   return false;
}
//一秒重新整理一次顯示時間
var timeID=setTimeout(showLeftTime,1000);
}
//-->
</script>
</head>
<body onload="showLeftTime()">
<label id="show">這裡顯示開始時間</label><br>
<label id="showLeft">這裡顯示剩餘時間</label>
</body>
</html>