JS倒數計時程式碼總結_javascript技巧

本文實例總結了常見的JS倒數計時器。分享給大家供大家參考。具體匯總如下：

第一種：精確到秒的javascript倒數計時程式碼

HTML代碼:

複製程式碼 程式碼如下: 離2010年還有: startclock() var timerID = null; var timerRunning = false; function showtime() { Today = new Date(); var NowHour = Today.getHours(); var NowMinute = Today.getMinutes(); var NowMonth = Today.getMonth(); var NowDate = Today.getDate(); var NowYear = Today.getYear(); var NowSecond = Today.getSeconds(); if (NowYear NowYear=1900 NowYear; Today = null; Hourleft = 23 - NowHour Minuteleft = 59 - NowMinute Secondleft = 59 - NowSecond Yearleft = 2009 - NowYear Monthleft = 12 - NowMonth - 1 Dateleft = 31 - NowDate if (Secondleft { Secondleft=60 Secondleft; Minuteleft=Minuteleft-1; } if (Minuteleft { Minuteleft=60 Minuteleft; Hourleft=Hourleft-1; } if (Hourleft { Hourleft=24 Hourleft; Dateleft=Dateleft-1; } if (Dateleft { Dateleft=31 Dateleft; Monthleft=Monthleft-1; } if (Monthleft { Monthleft=12 Monthleft; Yearleft=Yearleft-1; } Temp=Yearleft '年, ' Monthleft '月, ' Dateleft '天, ' Hourleft '小時, ' Minuteleft '分, ' Secondleft '秒' document.form1.left.value=Temp; timerID = setTimeout("showtime()",1000); timerRunning = true; } var timerID = null; var timerRunning = false; function stopclock () { if(timerRunning) clearTimeout(timerID); timerRunning = false; } function startclock () { stopclock(); showtime(); } // --> 第二種：某某運動會

HTML代碼:

複製程式碼 程式碼如下: function DigitalTime1() { var deadline= new Date("08/13/2007") //開幕倒數 var symbol="8月13日" var now = new Date() var diff = -480 - now.getTimezoneOffset() //是北京時間和當地時間的時間差 var leave = (deadline.getTime() - now.getTime()) diff*60000 var day = Math.floor(leave / (1000 * 60 * 60 * 24)) var hour = Math.floor(leave / (1000*3600)) - (day * 24) var minute = Math.floor(leave / (1000*60)) - (day * 24 *60) - (hour * 60) var second = Math.floor(leave / (1000)) - (day * 24 *60*60) - (hour * 60 * 60) - (minute*60) var deadline_2= new Date("08/13/2004") //開幕後計時 var symbol_2="8月13日" var now_2 = new Date() var diff_2 = -480 - now.getTimezoneOffset() //是北京時間和當地時間的時間差 var leave_2 = (now_2.getTime() - deadline_2.getTime()) diff_2*60000 var day_2 = Math.floor(leave_2 / (1000 * 60 * 60 * 24)) var hour_2 = Math.floor(leave_2 / (1000*3600)) - (day_2 * 24) var minute_2 = Math.floor(leave_2 / (1000*60)) - (day_2 * 24 *60) - (hour_2 * 60) var second_2 = Math.floor(leave_2 / (1000)) - (day_2 * 24 *60*60) - (hour_2 * 60 * 60) - (minute_2*60) day=day 1; day_2=day_2 1; if (day>0) //尚未開幕 { //LiveClock1.innerHTML = "現在" symbol "天" LiveClock1.innerHTML = " setTimeout("DigitalTime1()",1000) } if (day { //LiveClock1.innerHTML = "現在離" symbol "還有" day "天" hour "小時" minute "分" second "秒" LiveClock1.innerHTML = " setTimeout("DigitalTime1()",1000) } if (day==0) //正在開幕 { //LiveClock1.innerHTML = "現在" symbol "天" LiveClock1.innerHTML = " setTimeout("DigitalTime1()",1000) } if (day 19) //某某運動會結束 { //LiveClock1.innerHTML = "現在離" symbol "還有" day "天" hour "小時" minute "分" second "秒" LiveClock1.innerHTML = " setTimeout("DigitalTime1()",1000) } } // --> 第三種：小時倒數 HTML代碼:

複製程式碼 程式碼如下: var maxtime = 60*60 //一小時，以秒計算，自行調整! function CountDown(){ if(maxtime>=0){ minutes = Math.floor(maxtime/60); seconds = Math.floor(maxtime`); msg = "距離結束還有" minutes "分" seconds "秒"; document.all["timer"].innerHTML=msg; if(maxtime == 5*60) alert('注意，還有5分鐘!'); --maxtime; } else{ clearInterval(timer); alert("時間到，結束!"); } } timer = setInterval("CountDown()",1000); //--> 第四種：最簡倒數

HTML代碼:

複製程式碼 程式碼如下: var timedate= new Date("January 14,2006"); var times="研究生考試"; var now = new Date(); var date = timedate.getTime() - now.getTime(); var time = Math.floor(date / (1000 * 60 * 60 * 24)); if (time >= 0) ; document.write(" 現在離2006年" times "還有: " time " 天"); // End --> 第五種：最簡倒數二

HTML代碼:

複製程式碼 程式碼如下: function djs(){ var urodz= new Date("11/12/2008"); var now = new Date(); var num var ile = urodz.getTime() - now.getTime(); var dni = Math.floor(ile / (1000 * 60 * 60 * 24)); if (dni >1) num=dni 1 else if (dni == 1) num=2 else if (dni == 0) num=1 else num=0 document.write(num) } 距離某某開幕式還有 [ djs() ] 天 第六個：Javascript倒數計時器 - 採用系統時間自校驗

這次利用系統時間自校驗倒數計時, 無需手動調校使得倒數計時更為精確, 代碼及詳細註釋如下:

複製程式碼 程式碼如下: 00:01:11:00

JS倒數計時程式碼總結_javascript技巧

相關文章