<!-- 思路:考虑时间变化所有的情况:1.倒计时停止时:00:00:002.整点时变化:01:00:00 -> 00:59:593.整分时变化:00:10:00 -> 00:09:594.秒不零时变化:00:05:31 -> 00:05:30 -->
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>抢购倒计时</title>
6 <style type="text/css">
7 div{
8 margin-top: 200px;
9 margin-left: 700px;
10 width: 150px;
11 height: 200px;
12 background-color: red;
13 color: white;
14 }
15 h1,h5,span{
16 text-align: center;
17 }
18 </style>
19
20 </head>
21 <body>
22 <div>
23 <br/>
24 <h1>秒杀</h1>
25 <h5>本场距离结束还剩</h5>
26      
27 <span id="hour1">00:</span><span id="minute1">13:</span><span id="second1">00</span>
28 </div>
29 <input type="button" onclick="start()" value="开始">
30 <input type="button" onclick="stop()" value="停止">
31 <script type="text/javascript">
32 var hours = document.getElementById("hour1");
33 var minutes = document.getElementById("minute1");
34 var seconds = document.getElementById("second1");
35 var hour = 0;//设置小时
36 var minute = 13;//设置分钟
37 var second = 0;//设置秒数
38 var myInterval;//执行函数
39 //myInterval = setInterval(gogo,1000);
40 //开始函数
41 function start()
42 {
43 myInterval = setInterval(gogo,1000);
44 }
45 //暂停函数
46 function stop()
47 {
48 clearInterval(myInterval);
49 }
50
51 //时间过一秒
52 function gogo()
53 {
54 var zero=""; //时前边的符号,若小于10加个0
55 var fir =":"; //分前边的符号默认":",若小于10加个0
56 var sec =":"; //秒前边的符号默认":"若小于10加个0
57
58 hours.innerHTML = hour+fir;
59 minutes.innerHTML = minute+sec;
60 seconds.innerHTML = second;
61 if(second == 0 && minute == 0 && hour==0)
62 {
63 alert("秒杀完毕,请下次抢购!");
64 clearInterval(myInterval);
65 }else if(second == 0 && minute == 0)
66 {
67 hour--;
68 minute = 59;
69 second = 59;
70 }else if(second == 0 && minute !=0)
71 {
72 minute--;
73 second = 59;
74 }else
75 {
76 second--;
77 // alert(second1);
78 }
79
80 if(hour<10)
81 {
82 zero="0";
83 }
84 if(minute<10)
85 {
86 fir=":0";
87 }
88 if(second<10)
89 {
90 sec=":0";
91 }
92
93 hours.innerHTML = zero+hour+fir;
94 minutes.innerHTML = minute+sec;
95 seconds.innerHTML = second;
96 }
97 </script>
98 </body>
99 </html>