码迷,mamicode.com
首页 > 其他好文 > 详细

定时器----倒计时

时间:2017-11-05 17:19:42      阅读:126      评论:0      收藏:0      [点我收藏+]

标签:com   code   window   ntb   style   img   type   get   image   

 日期函数

技术分享

 

倒计时 =  用 将来的时间  -   现在的时间  

问题:       将来时间 距离 1970 毫秒数   -     现在距离 19701            

用将来的毫秒数 -  现在的毫秒数   不断转换就可以了

 

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <style>
 7         body{
 8             font-size:30px;
 9             text-align: center;
10             color:red;
11         }
12     </style>
13     <script>
14         window.onload = function(){
15             var demo = document.getElementById("demo");
16             var endTime = new Date("2017/11/12 17:30:00"); // 最终时间
17             setInterval(clock,1000); // 开启定时器
18             function clock(){
19                 var nowTime = new Date(); // 一定是要获取最新的时间
20                 //  console.log(nowTime.getTime());  获得自己的毫秒
21                 var second = parseInt((endTime.getTime() - nowTime.getTime()) / 1000);
22                 // 用将来的时间毫秒 -  现在的毫秒  / 1000 得到的 还剩下的秒  可能处不断 取整
23                // console.log(second);
24                  // 一小时 3600 秒
25                 // second / 3600  一共的小时数  /24   天数
26                 var d = parseInt(second / 3600 / 24);  //天数
27                 //console.log(d);
28                 var h = parseInt(second / 3600  % 24)  // 小时
29                // console.log(h);
30                 var m = parseInt(second / 60 );
31                 //console.log(m);
32                 var s = parseInt(second ); // 当前的秒
33                 console.log(s);
34                /* if(d<10)
35                 {
36                     d = "0" + d;
37                 }*/
38                 d<10 ? d="0"+d : d;
39                 h<10 ? h="0"+h : h;
40                 m<10 ? m="0"+m : m;
41                 s<10 ? s="0"+s : s;
42                 demo.innerHTML = "距离抢购时间还剩: "+d+""+h+"小时 "+m+"分钟 "+s+"";
43 
44             }
45         }
46     </script>
47 </head>
48 <body>
49 <div id="demo"></div>
50 </body>
51 </html>

 

定时器----倒计时

标签:com   code   window   ntb   style   img   type   get   image   

原文地址:http://www.cnblogs.com/stacey-zy/p/7787704.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!