显示当天关闭时间/第二天开放时间的倒计时

时间:2016-10-21 00:20:19

标签: javascript wordpress

我希望以小时显示倒计时:分钟:关闭时间(如果打开)或开启时间(关闭时的第二天)的秒数。我怎么能在HTML中做到这一点?

1 个答案:

答案 0 :(得分:0)



$(function() {
  var $timer = $('#timer');
  var $countdownText = $('#countdownText');
  var now = moment();
  var openingToday = moment({
    hour: 8
  });
  var closingTime = moment({
    hour: 17
  });
  var openingTime = moment({
    year: now.year(),
    month: now.month(),
    date: now.date() + 1,
    hour: 8
  });
  if (now.diff(openingToday) < 0) {
    $timer.countdown({
      until: openingToday._d
    });
    $countdownText.addClass('closed');
  } else if (now.diff(closingTime) < 0) {
    $timer.countdown({
      until: closingTime._d
    });
    $countdownText.addClass('opened');
  } else {
    $timer.countdown({
      until: openingTime._d
    });
    $countdownText.addClass('closed');
  }
});
&#13;
#countdownText span {
  display: none;
}

#countdownText.opened .close,
#countdownText.closed .open {
  display: inline;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.plugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.css" />
<div id="countdownText">
  <span class="open">Opening in</span>
  <span class="close">Closing in</span>
</div>
<div id="timer"></div>
&#13;
&#13;
&#13;