成人在线亚洲_国产日韩视频一区二区三区_久久久国产精品_99国内精品久久久久久久

您的位置:首頁技術文章
文章詳情頁

JS倒計時兩種實現方式代碼實例

瀏覽:84日期:2024-04-28 17:04:29

最近做瀏覽器界面倒計時,用js就實現,兩種方式:

一:設置時長,進行倒計時。比如考試時間等等

代碼如下:

<html><head><meta charset='UTF-8'><title>簡單時長倒計時</title><SCRIPT type='text/javascript'> var maxtime = 60 * 60; //一個小時,按秒計算,自己調整! function CountDown() {if (maxtime >= 0) { minutes = Math.floor(maxtime / 60); seconds = Math.floor(maxtime % 60); msg = '距離結束還有' + minutes + '分' + seconds + '秒'; document.all['timer'].innerHTML = msg; if (maxtime == 5 * 60)alert('還剩5分鐘'); --maxtime;} else{ clearInterval(timer); alert('時間到,結束!');} } timer = setInterval('CountDown()', 1000); </SCRIPT></head><body><div style='color:red'></div><div style='color:red'></div></body></html>

運行結果:

JS倒計時兩種實現方式代碼實例

二:設置時間戳,進行倒計時。比如距離活動結束時間等等

代碼如下:

<html><head> <meta charset='UTF-8'> <title>js簡單時分秒倒計時</title> <script type='text/javascript'> function countTime() { //獲取當前時間 var date = new Date(); var now = date.getTime(); //設置截止時間 var str='2017/5/17 00:00:00'; var endDate = new Date(str); var end = endDate.getTime(); //時間差 var leftTime = end-now; //定義變量 d,h,m,s保存倒計時的時間 var d,h,m,s; if (leftTime>=0) {d = Math.floor(leftTime/1000/60/60/24);h = Math.floor(leftTime/1000/60/60%24);m = Math.floor(leftTime/1000/60%60);s = Math.floor(leftTime/1000%60); } //將倒計時賦值到div中 document.getElementById('_d').innerHTML = d+'天'; document.getElementById('_h').innerHTML = h+'時'; document.getElementById('_m').innerHTML = m+'分'; document.getElementById('_s').innerHTML = s+'秒'; //遞歸每秒調用countTime方法,顯示動態時間效果 setTimeout(countTime,1000); } </script></head ><body onload='countTime()' > <div> <span id='_d'>00</span> <span id='_h'>00</span> <span id='_m'>00</span> <span id='_s'>00</span> </div></body></html>

運行結果:

JS倒計時兩種實現方式代碼實例

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持好吧啦網。

標簽: JavaScript
相關文章: