javascript实现抢购倒计时Demo程序

倒计时分为三种状态:

1) 未到抢购开始时间,显示:抢票倒计时××天××时××分××秒

2) 开始抢购,显示:抢票还剩××天××时××分××秒

3) 抢购完毕,显示:本轮抢购结束

 

抢购的起始时间和截止时间,可以通过C#代码输出。

 

此代码兼容其它浏览器。

 

 

[xhtml] view plain copy
  1.     <div id="clientclock">  
  2.     </div>  
  3.     <br />  
  4.     <br />  
  5.     <br />  
  6.     <br />  
  7.     <mce:script type="text/javascript"><!--  
  8.         //抢票起始时间 2011年2月29日10点10分0秒,月份的定义从0开始,因此1表示2月份。  
  9.         var start = new Date('2011', '1', '29', '10', '10', '00');  
  10.         //var start = new Date('2011','1', '28', '15', '10', '00');   
  11.   
  12.         //抢票截止时间 2011年2月29日11点10分59秒  
  13.         var expire = new Date('2011', '1', '29', '11', '10', '59');  
  14.   
  15.         //显示倒计时的HTML对象  
  16.         var clock = document.getElementById('clientclock');  
  17.   
  18.         //倒计时函数,每秒执行一次  
  19.         setLeftTime();  
  20.   
  21.         function setLeftTime() {  
  22.   
  23.             var now = new Date();  
  24.   
  25.             //如果当前时间小于抢票起始时间,那么显示:抢票倒计时××天××时××分××秒  
  26.             if (now < start) {  
  27.                 var diff = -480 - now.getTimezoneOffset() //是北京时间和当地时间的时间差     
  28.                 var lefttime = (start.getTime() - now.getTime()) + diff * 60000  
  29.                 var day = Math.floor(lefttime / (1000 * 60 * 60 * 24));  
  30.                 var hour = Math.floor(lefttime / (1000 * 3600)) - (day * 24);  
  31.                 var minute = Math.floor(lefttime / (1000 * 60)) - (day * 24 * 60) - (hour * 60);  
  32.                 var second = Math.floor(lefttime / (1000)) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);  
  33.   
  34.                 clock.innerHTML = '抢票倒计时:<span class="ztCopy">' + day + '</span>天&nbsp;<span class="ztCopy">' + hour + '</span>时&nbsp;<span class="ztCopy">' + minute + '</span>分&nbsp;<span class="ztCopy">' + second + '</span>秒';  
  35.             }  
  36.             //如果当前时间大于等于抢票起始时间,小于抢票截止时间,即:正在抢票,那么显示:抢票还剩××天××时××分××秒  
  37.             else if (now <= expire) {  
  38.                 var diff = -480 - now.getTimezoneOffset() //是北京时间和当地时间的时间差     
  39.                 var lefttime = (expire.getTime() - now.getTime()) + diff * 60000  
  40.                 var day = Math.floor(lefttime / (1000 * 60 * 60 * 24));  
  41.                 var hour = Math.floor(lefttime / (1000 * 3600)) - (day * 24);  
  42.                 var minute = Math.floor(lefttime / (1000 * 60)) - (day * 24 * 60) - (hour * 60);  
  43.                 var second = Math.floor(lefttime / (1000)) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);  
  44.   
  45.                 clock.innerHTML = '抢票还剩:<span class="ztCopy">' + day + '</span>天&nbsp;<span class="ztCopy">' + hour + '</span>时&nbsp;<span class="ztCopy">' + minute + '</span>分&nbsp;<span class="ztCopy">' + second + '</span>秒';  
  46.             }  
  47.             //如果当前时间大于抢票截止时间,即:本轮抢票结束,那么显示:本轮抢购结束  
  48.             else {  
  49.                 clock.innerHTML = '本轮抢购结束';  
  50.             }  
  51.   
  52.             setTimeout("setLeftTime()", 1000);  
  53.         }    
  54.   
  55.       
  56. // --></mce:script> 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值