微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

自己封装的一个简单的倒计时功能实例

因为平常工作中很常用到该功能,所以就利用这次国庆假期,重新梳理与对原有代码进行改善,再集成一个常用的功能,最终封装出这个“简单倒计时”功能

该倒计时方法具有以下该功能

1. 根据指定日期与当前的电脑时间进行匹配

2. 通过指定一个数组参数,来设置在每一天内不同的时间段进行倒计时。

* 该方法还未通过实际工作的检测,稳定性未知(如果实际工作通过,会删除这段话)

rush:js;"> 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(<a href="https://www.jb51.cc/tag/Now/" target="_blank" class="keywords">Now</a>Time < setTime.getTime()){
      break;
    }else if(i == filter.length-1){
      setTime.setDate(setTime.getDate()+1);
      setTime.setHours(filter[0]);
    }

  }
}
////////////////////////////

leftTime = Math.ceil((setTime - <a href="https://www.jb51.cc/tag/Now/" target="_blank" class="keywords">Now</a>Time)/1000);
if(<a href="https://www.jb51.cc/tag/Now/" target="_blank" class="keywords">Now</a>Time <= 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();
}

调用方式:

rush:js;"> // 普通调用 countDown('2016/10/02/23:43',oDiv); // 指定时间循环倒计时 countDown('2016/10/02/23:43',oDiv,[9,11,18]);

以上这篇自己封装的一个简单的倒计时功能实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

原文地址:https://www.jb51.cc/js/44249.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐