您好,登錄后才能下訂單哦!
本文實例講述了JS秒殺倒計時功能。分享給大家供大家參考,具體如下:
代碼
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body onload="miaosha();"> <p class="tit_right" > <span id="d" >00</span>天 <span id="h" >00</span>時 <span id="m" >00</span>分 <span id="s" >00</span>秒 </p> </body> </html> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script> var timer = null; // 秒殺函數 function miaosha(year, month, day, hour, minute, second) { // 剩余時間:設定的-當前的 var leftTime = (new Date(year, month - 1, day, hour, minute, second)) - (new Date()); // parseInt()返回一個整數。得出剩余的時分秒 var days = parseInt(leftTime / 1000 / 60 / 60 / 24, 10); var hours = parseInt(leftTime / 1000 / 60 / 60 % 24, 10); var minutes = parseInt(leftTime / 1000 / 60 % 60, 10); var seconds = parseInt(leftTime / 1000 % 60, 10); // 結束的時候 if (seconds < 0) { alert("快點!"); clearTimeout(timer); } else { // 格式的轉化 days = fix(days, 2); hours = fix(hours, 2); minutes = fix(minutes, 2); seconds = fix(seconds, 2); // 遞歸調用 注意:比當前時間大! timer = setTimeout("miaosha(2019,09,05,10,56,00)", 1000); //// 設置開始的時間 // 設置時分秒 document.getElementById("h").innerHTML = hours; document.getElementById("m").innerHTML = minutes; document.getElementById("s").innerHTML = seconds; document.getElementById("d").innerHTML = days; } } //fix函數:數字加0 function fix(num, length) { console.log(num); // 數字轉化為字符串 進行拼接 return num.toString().length<length?'0'+num:num; } </script>
顯示
PS:這里再為大家推薦幾款時間及日期相關工具供大家參考使用:
在線秒表工具:
http://tools.jb51.net/bianmin/miaobiao
在線日期/天數計算器:
http://tools.jb51.net/jisuanqi/date_jisuanqi
在線日期天數差計算器:
http://tools.jb51.net/jisuanqi/onlinedatejsq
Unix時間戳(timestamp)轉換工具:
http://tools.jb51.net/code/unixtime
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery日期與時間操作技巧總結》、《jQuery擴展技巧總結》、《jQuery常見事件用法與技巧總結》、《jQuery常用插件及用法總結》、《jQuery常見經典特效匯總》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。