请问这个限时抢购的 倒计时效果如何实现呢?
就是从数据库从提取商品记录 (抢购结束时间均为当天24:00) 一个倒计时的效果很容易实现,但是每个商品记录后面都显示这个倒计时效果就不会了 效果如http://www.newegg.com.cn/Products/Countdown.aspx 后每个产品后面的都跟个倒计时
及 即
产品名称 所剩时间(倒计时)
谢谢,在线等
------解决方案--------------------<HTML>
<HEAD>
</HEAD>
<BODY>
<div id='divs'>
<div>商品A <span></span></div>
<br>
<div>商品b <span></span></div>
<br>
<div>商品C <span></span></div>
<br>
<div>商品D <span></span></div>
</div>
<div id='CountMsg'></div>
<script language="JavaScript">
function GetRTime(){
var EndTime= new Date("2/11/2009"); //截止时间(月 日 年)
var NowTime = new Date();
var nMS =EndTime.getTime() - NowTime.getTime();
var nD =Math.floor(nMS/(1000 * 60 * 60 * 24));
var nH=Math.floor(nMS/(1000*60*60)) % 24;
var nM=Math.floor(nMS/(1000*60)) % 60;
var nS=Math.floor(nMS/1000) % 60;
var Remain=document.getElementById("divs").getElementsByTagName('SPAN');
if(nD>= 0){
for(var i=0;i<Remain.length;i++){
Remain[i].innerHTML=nD+'天'+nH+'小时'+nM+'分'+nS+'秒';
}
}
else {
document.getElementById("CountMsg").innerHTML="时已过!";
}
setTimeout("GetRTime()",1000);
}
window.onload=GetRTime;
</script>
</BODY>
</HTML>
------解决方案--------------------你也可以用
setInterval,不一定用setTimeout
比如这样
JScript code
function GetRTime(datevule,id){
var EndTime= new Date(datevule); //截止时间(月 日 年)
var NowTime = new Date();
var nMS =EndTime.getTime() - NowTime.getTime();
var nD =Math.floor(nMS/(1000 * 60 * 60 * 24));
var nH=Math.floor(nMS/(1000*60*60)) % 24;
var nM=Math.floor(nMS/(1000*60)) % 60;
var nS=Math.floor(nMS/1000) % 60;
if(nD>= 0){
document.getElementById(id+"D").innerHTML=nD;
document.getElementById(id+"H").innerHTML=nH;
document.getElementById(id+"M").innerHTML=nM;
document.getElementById(id+"S").innerHTML=nS;
}
else {
document.getElementById(id+"Msg").innerHTML="时已过!";
}
}
setInterval("GetRTime("2/11/2009","Remain")",1000);
setInterval("GetRTime("3/11/2009","Rebody")",1000);