<!-- 思路:考虑时间变化所有的情况:
1.倒计时停止时:00:00:00
2.整点时变化:01:00:00 -> 00:59:59
3.整分时变化:00:10:00 -> 00:09:59
4.秒不零时变化: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>