请教这个限时抢购的 倒计时效果怎么实现呢
日期：2014-05-17 浏览次数：20802 次
请问这个限时抢购的 倒计时效果如何实现呢？
就是从数据库从提取商品记录 （抢购结束时间均为当天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
比如这样
就是从数据库从提取商品记录 （抢购结束时间均为当天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);
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
