setInterval不适用于内容自动更新

Question

我正在尝试使用此https://codepen.io/zeinab92/pen/xwWGWM

但是，它不会在不重新加载页面的情况下自动更新“小时，分钟和状态”。

我如何使其工作，时间会自动更新，状态文本也会根据时间条件（无论是打开还是关闭）进行更新。

除了自动更新问题外，我喜欢该脚本，我尝试通过创建新函数来解决这个问题，

setInterval(function() {
  $("#timeDiv").html(data);
}, 1000);

通过禁用默认值

setInterval(checkTime, 1000);

或setTimeout而不是setInterval

但是没有运气。

Answer 1

调试后，我发现了代码问题。

您现在已经在checkTime函数外部声明为全局变量，并且当页面加载时现在变量存储新Date的值，即页面加载时的Date值。 因此，由于全局变量仅执行一次，因此now的值仅更新一次。

解决方案：将now变量放在checkTime内，以便每次调用checkTime时 ，它每次都具有Date的新值。

function checkTime(){
var now=new Date();

....
}

希望这能解决问题。 （ JS小提琴 ）