2種簡(jiǎn)單的js倒計(jì)時(shí)方式

更新時(shí)間：2017年10月20日 15:06:37 作者：逗伴不是瓣

這篇文章主要為大家詳細(xì)介紹了2個(gè)簡(jiǎn)單js倒計(jì)時(shí)方式，一是帶天數(shù)的倒計(jì)時(shí)，二是單純分鐘和秒倒計(jì)時(shí)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

一般倒計(jì)時(shí)的時(shí)間都是后臺(tái)傳來(lái)的然后渲染到頁(yè)面，這里有2個(gè)簡(jiǎn)單的倒計(jì)時(shí)方式

//帶天數(shù)的倒計(jì)時(shí)
function countDown(times){
 var timer=null;
 timer=setInterval(function(){
  var day=0,
   hour=0,
   minute=0,
   second=0;//時(shí)間默認(rèn)值
  if(times > 0){
   day = Math.floor(times / (60 * 60 * 24));
   hour = Math.floor(times / (60 * 60)) - (day * 24);
   minute = Math.floor(times / 60) - (day * 24 * 60) - (hour * 60);
   second = Math.floor(times) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
  }
  if (day <= 9) day = '0' + day;
  if (hour <= 9) hour = '0' + hour;
  if (minute <= 9) minute = '0' + minute;
  if (second <= 9) second = '0' + second;
  //
  console.log(day+"天:"+hour+"小時(shí)："+minute+"分鐘："+second+"秒");
  times--;
 },1000);
 if(times<=0){
  clearInterval(timer);
 }
}

//單純分鐘和秒倒計(jì)時(shí)
function resetTime(time){
 var timer=null;
 var t=time;
 var m=0;
 var s=0;
 m=Math.floor(t/60%60);
 m<10&&(m='0'+m);
 s=Math.floor(t%60);
 function countDown(){
  s--;
  s<10&&(s='0'+s);
  if(s.length>=3){
  s=59;
  m="0"+(Number(m)-1);
  }
  if(m.length>=3){
  m='00';
  s='00';
  clearInterval(timer);
  }
  console.log(m+"分鐘"+s+"秒");
 }
 timer=setInterval(countDown,1000);
}

如何使用

更多關(guān)于倒計(jì)時(shí)的文章請(qǐng)查看專(zhuān)題：《倒計(jì)時(shí)功能》

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Webpack中publicPath路徑問(wèn)題詳解
這篇文章主要介紹了Webpack中publicPath路徑問(wèn)題詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-05-05
JS(JQuery)操作Array的相關(guān)方法介紹
本篇文章主要是對(duì)JS(JQuery)操作Array的相關(guān)方法進(jìn)行了詳細(xì)的介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-02-02
Bootstrap按鈕下拉菜單組件詳解
這篇文章主要為大家詳細(xì)介紹了Bootstrap按鈕下拉菜單組件，感興趣的小伙伴們可以參考一下
2016-05-05
JavaScript實(shí)現(xiàn)繼承的4種方法總結(jié)
這篇文章主要介紹了JavaScript實(shí)現(xiàn)繼承的4種方法總結(jié),本文給出了原型鏈繼承、構(gòu)造繼承、實(shí)例繼承、拷貝繼承等實(shí)現(xiàn)JS繼承的方法,需要的朋友可以參考下
2014-10-10
uniapp實(shí)現(xiàn)人臉識(shí)別功能詳細(xì)示例
這次使用uni-app框架開(kāi)發(fā)一個(gè)小程序,有一個(gè)刷臉功能,所以下面這篇文章主要給大家介紹了關(guān)于uniapp實(shí)現(xiàn)人臉識(shí)別功能的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-10-10
詳解處理bootstrap4不支持遠(yuǎn)程靜態(tài)框問(wèn)題
這篇文章主要介紹了詳解處理bootstrap4不支持遠(yuǎn)程靜態(tài)框問(wèn)題，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-07-07
javascript div 遮罩層封鎖整個(gè)頁(yè)面
在客戶(hù)端瀏覽器中，可以在某個(gè)時(shí)機(jī)使用javascript把一個(gè)div作為遮罩層，來(lái)封鎖整個(gè)頁(yè)面。
2009-07-07
利用javascript中的call實(shí)現(xiàn)繼承
利用javascript中的call實(shí)現(xiàn)繼承...
2007-01-01
淺談js數(shù)組和splice的用法
下面小編就為大家?guī)?lái)一篇淺談js數(shù)組和splice的用法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-12-12
JavaScript requestAnimationFrame動(dòng)畫(huà)詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript requestAnimationFrame動(dòng)畫(huà)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-09-09