自己封裝的一個簡單的倒計時功能實例
更新時間：2016年11月23日 10:27:08 投稿：jingxian
下面小編就為大家?guī)硪黄约悍庋b的一個簡單的倒計時功能實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
因為平常工作中很常用到該功能，所以就利用這次國慶假期，重新梳理與對原有代碼進行改善，再集成一個常用的功能，最終封裝出這個“簡單倒計時”功能。
該倒計時方法具有以下該功能：
1. 根據(jù)指定日期與當(dāng)前的電腦時間進行匹配
2. 通過指定一個數(shù)組參數(shù)，來設(shè)置在每一天內(nèi)不同的時間段進行倒計時。
* 該方法還未通過實際工作的檢測，穩(wěn)定性未知（如果實際工作通過，會刪除這段話）
function countDown(date,target,filter){
var setTime = new Date(date).getTime(),
timer = null;
function core(){
var nowTime = new Date().getTime(),
leftTime = 0,
d = 0,h = 0,m = 0,s = 0;
////////////////////////////
//conditation @ doublue time
if(filter.length){
setTime = new Date();
for(var i=0,l=filter.length;i<l;i++){
setTime.setHours(filter[i]);
setTime.setMinutes(0);
setTime.setSeconds(0);
if(nowTime < setTime.getTime()){
break;
}else if(i == filter.length-1){
setTime.setDate(setTime.getDate()+1);
setTime.setHours(filter[0]);
}
}
}
////////////////////////////
leftTime = Math.ceil((setTime - nowTime)/1000);
if(nowTime <= setTime){
d = ~~(leftTime/86400);
h = ~~(leftTime%86400/3600);
m = ~~(leftTime%86400%3600/60);
s = ~~(leftTime%86400%3600%60);
timer = setTimeout(core,1e3);
}else{
clearTimeout(timer);
timer = null;
}
//here set out format
target.innerHTML = 'd:'+d+' h:'+h+' m:'+m+' s:'+s;
}
core();
}
調(diào)用方式：
// 普通調(diào)用
countDown('2016/10/02/23:43',oDiv);
// 指定時間循環(huán)倒計時
countDown('2016/10/02/23:43',oDiv,[9,11,18]);
以上這篇自己封裝的一個簡單的倒計時功能實例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
通過Javascript創(chuàng)建一個選擇文件的對話框代碼
通過Javascript創(chuàng)建一個選擇文件的對話框代碼，需要的朋友可以參考下2012-06-06
這篇文章主要介紹了15個簡單的JS編碼標準讓你的代碼更整潔(小結(jié)),文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
這篇文章主要為大家詳細介紹了js獲取數(shù)組中的最大值的9種方法，以及每種方法的工作原理和用法，文中的示例代碼講解詳細，需要的可以參考下2023-08-08
微信公眾號中的JSSDK接入及invalid signature等常見錯誤問題分析(全面解析)
這篇文章主要介紹了微信公眾號中的JSSDK接入及invalid signature等常見錯誤問題分析(全面解析),需要的朋友可以參考下2020-04-04
這篇文章主要介紹了js實現(xiàn)的奧運倒計時時鐘效果代碼,可實現(xiàn)根據(jù)指定時間進行倒計時的實時顯示效果,非常簡單實用,需要的朋友可以參考下2015-12-12
微信小程序?qū)W習(xí)總結(jié)（五）常見問題實例小結(jié)
這篇文章主要介紹了微信小程序常見問題,結(jié)合實例形式總結(jié)分析了微信小程序常見錯誤、數(shù)據(jù)緩存、界面交換等相關(guān)操作技巧,需要的朋友可以參考下2020-06-06
2008-03-03
大家都知道JS是一門動態(tài)語言，與傳統(tǒng)的c和c++最大的區(qū)別就是js是在運行時動態(tài)檢測值的類型和變化。this是js中的一個關(guān)鍵字，它代表當(dāng)前作用域的上下文環(huán)境，而且隨著上下文的改變而動態(tài)變化。這篇文章我們將詳細介紹Javascript中綁定this的三種方法與簡單的比較。2016-10-10
這篇文章主要介紹了Javascript仿新浪游戲頻道鼠標懸停顯示子菜單效果,涉及鼠標事件及頁面元素結(jié)點的遍歷技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
本篇文章主要是對js中判斷對象是否為空的三種實現(xiàn)方法進行了詳細的分析介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12