给园子种花种菜

导航

使用javaScript实现简单倒计时功能

效果如下:

1 <div class="warp">
2     <p id="txt">距离”十一“国庆放假还有:</p><br>
3     <p id="time"></p>
4 </div>

javaScript源码:

 1 <script>
 2     $(document).ready(function(e) {
 3         
 4         function timer()
 5         {
 6             //获取系统当前时间
 7             var seconds;
 8             var minutes;
 9             var hours;
10             var days;
11             var year;
12             var mouth;
13             
14             var date = new Date();
15             seconds = date.getSeconds();
16             minutes = date.getMinutes();
17             hours = date.getHours();
18             year = date.getFullYear();
19             mouth = date.getMonth()+1;
20             days = date.getDate();
21             
22             //因为Date获取的当前时间月份是0-11,少一个月,因此需先获取到各个时间后,重新定义当前时间
23             var shiyi = new Date(2015,10,1,0,0,0);
24             var nowDate = new Date(year,mouth,days,hours,minutes,seconds);
25             
26             var shiyiTime = shiyi.getTime();
27             var nowTime = nowDate.getTime();
28             
29             var cTime = shiyiTime - nowTime;
30             var cDD = checkTime(parseInt(cTime/(1000*60*60*24),10));
31             var cHH = checkTime(parseInt(cTime/1000/60/60%24,10));
32             var cMM = checkTime(parseInt(cTime/1000/60%60,10));
33             var cSS = checkTime(parseInt(cTime/1000%60,10));
34             
35             function checkTime(i)
36             {
37                 if(i < 10)
38                 {
39                     i = "0" + i;    
40                 }    
41                 return i;
42             }
43             
44             document.getElementById("time").innerHTML = cDD+"天"+cHH+"时"+cMM+"分"+cSS+"秒";
45         }
46         setInterval(timer,1000);
47            
48     });
49 </script>

 

posted on 2015-09-18 13:46  给园子种花种菜  阅读(380)  评论(0编辑  收藏  举报