效果相似於:購物搶購倒計時-->在跳轉N多個頁面以後,倒計時間仍然正常顯示。javascript
思路:html
結束時間是固定不變的(endTime),一直在改變的是當下的時間(curTime = new date());java
時間差 = 結束時間 - 開始時間(leftTime = endTime - curTime);spa
知識點:htm
new Date("2017/06/22,17:00:00");//獲取結束時間的時間點(固定)blog
new Date();//獲取當下的時間(不斷變化)ip
setInterval //倒計時string
clearInterval();//清除倒計時io
<p class="time"></p>function
function timeLeft(select,endTime,curTime = new Date()){//curTime默認爲當下時間 var leftTime = endTime - curTime;//時間差 if(leftTime <= 0){//若是時間差小於等於0 clearInterval(timer);//清除定時器 $(select).text(0+"天"+0+"時"+0+"分"+0+"秒"+0+"毫秒"); }else{ var days = Math.floor(leftTime/(1000*60*60*24));//天 var hours = Math.floor(leftTime/(1000*60*60)%60);//時 var mi = Math.floor(leftTime/(1000*60)%60);//分 var se = Math.floor(leftTime/1000%60);//秒 var ms = Math.floor(leftTime%1000);//毫秒 $(select).text(days+"天"+hours+"時"+mi+"分"+se+"秒"+ms+"毫秒"); } } var timer = setInterval(function(){//倒計時 timeLeft(".time",new Date("2017/6/22,17:00:00"));//第一個參數是選擇器,第二個參數是結束時間,第三個參數默認爲當下時間 },1);//1毫秒倒計時:時間間隔爲1,1秒倒計時:時間間隔爲1000
其餘:https://www.cnblogs.com/jiqing9006/p/5737312.html