js 利用moment.js做一个时分秒倒计时

阅读 (6)
设置一个目标时间,然后根据目标时间显示倒计时

HTML: 

<div class="timedown"></div>

 JS:里面用到了一些momentjs的日期比较方式

// 时间补零
function PrefixInteger(num, n) {
  return (Array(n).join(0) + num).slice(-n);
}

// 倒计时
setTime = setInterval(function () {
  var endTime = moment('2019-12-07 00:00:00');
  var startTime = moment(moment().format('YYYY-MM-DD HH:mm:ss'));
  // 距离2019-12-07还有多少时分秒
  var hoursLeft = endTime.diff(startTime, 'hours');
  var minutesLeft = endTime.diff(startTime, 'minutes');
  var secondsLeft = endTime.diff(startTime, 'seconds');
  var secondsCount = secondsLeft;
  // 小时剩余时间转分,然后用总剩余分钟数取余,即是倒数分钟数
  minutesLeft = minutesLeft > 60 ? minutesLeft % (hoursLeft * 60) : minutesLeft;
  // 分钟剩余时间转秒,小时剩余时间转秒, 最后用总剩余秒数取余即是倒数秒
  secondsLeft = secondsLeft > 60 ? secondsLeft % (minutesLeft * 60 + hoursLeft * 60 * 60) : secondsLeft;
  $('.timedown').html(PrefixInteger(hoursLeft,2) +':'+PrefixInteger(minutesLeft,2)+':'+PrefixInteger(secondsLeft,2));
  // 倒计时结束时清除计时器执行其它逻辑
  if(secondsCount <= 0) {
    clearInterval(setTime);
  }
}, 1000);

 

更新于:2019-12-03 10:28:08

留言

发表评论

标记为*的字段是必填项(邮箱地址不会被公开), 由于国内舆论控制, 评论需要管理员审核通过方可展示

返回顶部