自從不知道多久之前看到了網購網站的倒數計時的功能，心裡有個底大概能夠理解那是怎麼弄出來的，很想試一下，還稍微美編過我的圖，但是我弄不出來 = = "(跪)。
目前在資料庫都建好資料了，其中一欄可以設定倒數計時的時數，型態是int，想要利用最low的迴圈的方式載入每一筆的資料以及其倒數時數，分別倒數各筆資料的時間。
現在在網路上爬文的結果多半都是靜態的方式，做一個倒數的功能，所以javascript的事件都放在body標籤裡onload，所以我現在正卡我想要讓他迴圈，各筆資料跑各筆資料的倒數時數。
is anyone have better way to do?
疑問:有沒有可以不要用onload的方法來達成這個範例?
mycode:
(這個code來源是參考網路四面八方的範例，google搜尋:javascript倒數計時，基本上搜尋到的結果大同小異 )
主要參考來源:
[PHP][JavaScript][CSS] 倒數計時之範例
[jQuery] 倒數計時(還有X天X時X分X秒)
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>只是練習</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body onload="clock();return true">
<div class="wrapper" >
<div class="ho time_block first"></div>
<div class="min time_block "></div>
<div class="sec time_block"></div>
<div class="buybtn"><a href="#" title="buynow"></a></div>
</div>
<script language="JavaScript">
var DIFFERENCE_HOUR,DIFFERENCE_MINUTE,DIFFERENCE_SEC =1;
var hoursms = 60 * 60 * 1000;
var Secondms = 60 * 1000;
var microsecond = 1000;
function clock()
{
var Expiration_time = new Date("2012/8/18 21:00:00"); //到期時間
var time = new Date();//取得現在的時間資料
var minute = time.getMinutes();//現在的分
var second = time.getSeconds();//現在的秒
//計算現在的時間資料與倒數標的之差異
var convertHour = DIFFERENCE_HOUR;
var convertMinute = DIFFERENCE_MINUTE;
var convertSecond = DIFFERENCE_SEC;
var Diffms = Expiration_time.getTime() - time.getTime();
DIFFERENCE_MINUTE = Math.floor(Diffms / hoursms);
Diffms -= DIFFERENCE_MINUTE * hoursms;
DIFFERENCE_SEC = Math.floor(Diffms / Secondms);
Diffms -= DIFFERENCE_SEC * Secondms ;
/*$('.day').html=""; $('.ho').html=""; $('.min').html="";*/ //div區塊內容初始化 可略
if(convertMinute != DIFFERENCE_MINUTE){$('.ho').html(DIFFERENCE_MINUTE)};
if(convertSecond != DIFFERENCE_SEC){$('.min').html(DIFFERENCE_SEC)};
var dSecs = Math.floor(Diffms / microsecond);
$('.sec').html(dSecs);
setTimeout("clock()",1000);//每1秒不斷自動呼叫 clock() 每秒更新一次
}
</script>
</body>
</html>
沒有留言:
張貼留言
若你看的文章，時間太久遠的問題就別問了，因為我應該也忘了... XD