<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns=" <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>日期計算</title>
<script src="./jquery1.6.2.js" type="text/javascript"></script>
<style>
.error{color:red}
</style>
<script type="text/javascript">
var intervalID = 0;
function calculate(inputTime){
var now = new Date();
var t = new Date(inputTime);
var past = (inputTime < now.getTime()) ? 1 : 0; //輸入的時間過去了就是1，否則為0
var difference = 0; //差值
//下面的差值減去八個小時，是因為new Date(0)是"Thu Jan 1 08:00:00 UTC+0800 1970"，從八點開始算的
if(past) difference = new Date(now.getTime() - inputTime - 8 * 3600 * 1000);
else difference = new Date(inputTime - now.getTime() - 8 * 3600 * 1000);
//計算過去的天數、小時、分鐘和秒。天數要自己算，其它的get就行了
var dDays = parseInt(difference.getTime() / 3600 / 24 /1000);
var dHours = difference.getHours();
var dMinutes =difference.getMinutes();
var dSeconds = difference.getSeconds();
$("#output").html([
"現在時間是：<font color='blue'>", now.toLocaleString(),"</font>，","<br />",
"<font color='blue'>", t.toLocaleString(),"</font>",
["還要", "已經過去了"][past],
"<font color='blue'>",dDays, "天", dHours, "小時", dMinutes, "分鐘", dSeconds, "秒","</font>",
["才到", ""][past]
].join(""));//用join方法將上面的數組連接起來
}
function btn_calculate(){
clearInterval(intervalID);
$("#error").className = null;
var t = new Date($("#t").val());
if(t.getTime().toString() == "NaN"){ //如果輸入的時間不對，則將提示字符設置為error，即紅色
$("#error").className = "error";
$("#t").select();
return false;
}
intervalID = setInterval("calculate(" + t.getTime() + ")", 1000); //設置定時器，每秒鐘執行一次calculate函數
return false;
}
</script>
</head>
<body>
<form onsubmit="return btn_calculate()">
<div><span id="error">請輸入要計算的時間（格式：2010/02/01 23:07，省略時分秒則是00:00:00）：</span>
<input id="t" value="2010/02/01 23:07" /> <input type="submit" value="計算時間">
</div><br />
<div id="output"></div><!--輸出區域-->
</body>
</html>