javascript - 使用javascript根据一天中的时间实时打印出 "Open"或Closed

Question

好的，我有一个餐厅网站。现在我在 javascript 中有一个简单的 if 语句，它根据一天中的时间将一段文本从 Were open 更改为 Were Closed。但是，如果在手机上关闭浏览器时，从技术上讲，它仍会在后台打开。因此，如果您重新打开浏览器，它会在应该说已关闭的时间之后显示已打开，直到您刷新页面。我想找到一种方法让它实时更新。我已经尝试使用 setInterval 和 setTimeout 来完成这个以及 while 循环，但到目前为止，什么都没有。我的意思是当我使用 setInterval 时我可以打印时间并且它会实时增加。那么为什么它不能每秒运行我的 if 语句并打印所需的文本。

这是我的代码，目前只显示它。

 var date = new Date().getHours();
 if ((date > 9) && (date < 20) && (day != 0)) {
        y="<span style=\"color:#07ed11\">We're Open!</span>";
    }
    else {
      y="<span style=\"color:#fc4b1c\">Sorry we're Closed.</span>"; 
    }
                    document.getElementById("open-close").innerHTML=y;

我只是想让它实时打印我们的信息，这样我就可以看到它在时机成熟时从打开到关闭的变化

Answer 1

jsFiddle例子

新版本

我冒昧地回去修改了这个。我认为这个版本会更好用

var checkOpenStatus = function () {
    var d = new Date();
    var date = d.getHours();
    var day = d.getDay();
    if ((date > 9) && (date < 20) && (day != 0)) {
        y = "<span style=\"color:#07ed11\">We're Open!</span>";
    } else {
        y = "<span style=\"color:#fc4b1c\">Sorry we're Closed.</span>";
    }
    document.getElementById("open-close").innerHTML = y;
    setTimeout(checkOpenStatus,15000);
};

checkOpenStatus();

它每 15 秒而不是每 100 毫秒运行一次。

旧版本

试试这个

var checkOpenStatus = function () {
    var d = new Date();
    var date = d.getHours();
    var day = d.getDay();
    if ((date > 9) && (date < 20) && (day != 0)) {
        y = "<span style=\"color:#07ed11\">We're Open!</span>";
    } else {
        y = "<span style=\"color:#fc4b1c\">Sorry we're Closed.</span>";
    }
    document.getElementById("open-close").innerHTML = y;
}
setInterval(checkOpenStatus,100); //removed anon function

它在 setInterval 上每 100 毫秒更新一次。您可以根据自己的喜好将其更改为更快或更慢。