自己封裝的一個(gè)簡(jiǎn)單的倒計(jì)時(shí)功能實(shí)例
因?yàn)槠匠９ぷ髦泻艹Ｓ玫皆摴δ?，所以就利用這次國(guó)慶假期，重新梳理與對(duì)原有代碼進(jìn)行改善，再集成一個(gè)常用的功能，最終封裝出這個(gè)“簡(jiǎn)單倒計(jì)時(shí)”功能。
該倒計(jì)時(shí)方法具有以下該功能：
1. 根據(jù)指定日期與當(dāng)前的電腦時(shí)間進(jìn)行匹配
2. 通過(guò)指定一個(gè)數(shù)組參數(shù)，來(lái)設(shè)置在每一天內(nèi)不同的時(shí)間段進(jìn)行倒計(jì)時(shí)。
* 該方法還未通過(guò)實(shí)際工作的檢測(cè)，穩(wěn)定性未知（如果實(shí)際工作通過(guò)，會(huì)刪除這段話）
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);
// 指定時(shí)間循環(huán)倒計(jì)時(shí)
countDown('2016/10/02/23:43',oDiv,[9,11,18]);
以上這篇自己封裝的一個(gè)簡(jiǎn)單的倒計(jì)時(shí)功能實(shí)例就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
通過(guò)Javascript創(chuàng)建一個(gè)選擇文件的對(duì)話框代碼
通過(guò)Javascript創(chuàng)建一個(gè)選擇文件的對(duì)話框代碼，需要的朋友可以參考下2012-06-06
15個(gè)簡(jiǎn)單的JS編碼標(biāo)準(zhǔn)讓你的代碼更整潔(小結(jié))
這篇文章主要介紹了15個(gè)簡(jiǎn)單的JS編碼標(biāo)準(zhǔn)讓你的代碼更整潔(小結(jié)),文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
這篇文章主要為大家詳細(xì)介紹了js獲取數(shù)組中的最大值的9種方法，以及每種方法的工作原理和用法，文中的示例代碼講解詳細(xì)，需要的可以參考下2023-08-08
微信公眾號(hào)中的JSSDK接入及invalid signature等常見(jiàn)錯(cuò)誤問(wèn)題分析(全面解析)
這篇文章主要介紹了微信公眾號(hào)中的JSSDK接入及invalid signature等常見(jiàn)錯(cuò)誤問(wèn)題分析(全面解析),需要的朋友可以參考下2020-04-04
js實(shí)現(xiàn)的奧運(yùn)倒計(jì)時(shí)時(shí)鐘效果代碼
這篇文章主要介紹了js實(shí)現(xiàn)的奧運(yùn)倒計(jì)時(shí)時(shí)鐘效果代碼,可實(shí)現(xiàn)根據(jù)指定時(shí)間進(jìn)行倒計(jì)時(shí)的實(shí)時(shí)顯示效果,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-12-12
微信小程序?qū)W習(xí)總結(jié)（五）常見(jiàn)問(wèn)題實(shí)例小結(jié)
這篇文章主要介紹了微信小程序常見(jiàn)問(wèn)題,結(jié)合實(shí)例形式總結(jié)分析了微信小程序常見(jiàn)錯(cuò)誤、數(shù)據(jù)緩存、界面交換等相關(guān)操作技巧,需要的朋友可以參考下2020-06-06
一個(gè)javascript參數(shù)的小問(wèn)題
2008-03-03
大家都知道JS是一門(mén)動(dòng)態(tài)語(yǔ)言，與傳統(tǒng)的c和c++最大的區(qū)別就是js是在運(yùn)行時(shí)動(dòng)態(tài)檢測(cè)值的類型和變化。this是js中的一個(gè)關(guān)鍵字，它代表當(dāng)前作用域的上下文環(huán)境，而且隨著上下文的改變而動(dòng)態(tài)變化。這篇文章我們將詳細(xì)介紹Javascript中綁定this的三種方法與簡(jiǎn)單的比較。2016-10-10
Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果
這篇文章主要介紹了Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果,涉及鼠標(biāo)事件及頁(yè)面元素結(jié)點(diǎn)的遍歷技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
js中判斷對(duì)象是否為空的三種實(shí)現(xiàn)方法
本篇文章主要是對(duì)js中判斷對(duì)象是否為空的三種實(shí)現(xiàn)方法進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12