Show/hide div 基于一天中的时间 jquery

Question

我有一些代码，我认为应该可以根据一天中的时间显示或隐藏两个 div。它目前显示 "closed" div 尽管时间比现在晚 - 我错过了什么吗？该网站只有两台机器运行所以它只需要在它们上设置时间。

$(document).ready(function () {
var d = new Date();
var time = d.getHours() + ":" + d.getMinutes();

if (time > ("08:29") && time < ("16:29")) {
    $('.hours').show();
    $('.closed').hide();
}
else {
    $('.hours').hide();
    $('.closed').show();
    }
});

Answer 1

日期对象上的

getHours() 和 getMinutes() 没有补零。所以如果它是 08:03，那就是 8:3。

也许考虑使用 MomentJS，您可以在其中调用 format 日期并将其解析为所需格式。

编辑：作为快速修复，使用 d.toISOString().split('T')[1]

Answer 2

你不会用字符串比较时间。您需要两个日期对象来比较它们。

更简单的方法是再创建两个日期并根据上下限设置时间。然后将您的源时间与限制进行比较。

$(document).ready(function () {
  var d = new Date();
  var low = new Date();
  var high = new Date();

  low.setHours(8);
  low.setMinutes(29);
  high.setHours(16);
  high.setMinutes(29);

  if (d.getTime() > low.getTime() && d.getTime() < high.getTime()) {
    $('.hours').show();
    $('.closed').hide();
  } else {
    $('.hours').hide();
    $('.closed').show();
  }
});

Date#getTime()returns毫秒数，比较方便

Answer 3

var time = new Date();

添加两个变量：

var startTime = new Date().setHours(8,29);
var endTime = new Date().setHours(16,29);

并在 if 语句中使用此表达式

if (time.getTime() > startTime && time.getTime() < endTime) {

Answer 4

我已经为你准备了演示here，我们将在其中做类似的事情

var start = new Date();
var end = new Date();
var time = new Date().getTime();

if (time > start.setHours(8,29) && time < end.setHours(16,29))

Show/hide div 基于一天中的时间 jquery

Show/hide div based on time of day jquery

time

jquery

range

show

hide