一个简单的js倒计时功能

轩陌

分类: 实战案例 1517 6

对倒计时功能做了一个小小封装,传入一个结束时间即可,返回返回结果,如果结束时间大于当前时间,就开始倒计时,反则用于结束定时器
时间换算关系,利于方便,这里将毫秒先转换成秒在进行时间换算,定义变量t等于秒,t = Math.floor( (endTime – nowTime) / 1000 )
秒换天: Math.floor( t/86400 )
秒换时: Math.floor( t%86400/3600 )
秒换分: Math.floor( t%86400%3600/60 )
秒: t%60


var oBox = document.querySelector('.box');
var endTime = new Date( 2019,0,3,12,47,30 );
// 避免一秒的延迟
oBox.innerHTML = '距离2019年1月3日 12时47分30秒还剩余:' + timer(endTime);
// 定义一个定时器
var time = setInterval(function() {
  if (!timer(endTime)) clearInterval(time);
  oBox.innerHTML = '距离2019年1月3日 12时47分30秒还剩余:' + timer(endTime);
}, 1000);
// 时间封装
function timer(endTime){
  var nowTime = new Date();
  var str = '';
  var t = Math.floor( (endTime - nowTime) / 1000 );
  if( t >= 0 ){
    // 天 时 分 秒拼接
    str = Math.floor( t/86400 ) + '天' + twoNum(Math.floor( t%86400/3600 )) + '时' + twoNum(Math.floor( t%86400%3600/60 )) + '分' + twoNum(t%60) + '秒';
    return str;
  }else{
    return 0;
  }
  function twoNum(n) {
    return n > 9 ? n : '0' + n;
  }
}
  • 18人 Love
  • 4人 Haha
  • 1人 Wow
  • 3人 Sad
  • 0人 Angry
JavaScript、js倒计时、js特效

作者简介:轩陌

打赏

生命的意义在于折腾。

共 6 条评论关于 “一个简单的js倒计时功能”

Loading...