setTimeout() 运行函数但日期未更新

Question

我在有关 setTimeout() 的所有其他线程中找不到任何修复，所以这里是：

我做了一个数字时钟，如果你刷新页面，它会显示正确的时间。 但是 setTimeout 不会每 500 毫秒刷新一次页面？ 老师看了我的代码，竟然不知道为什么？ 所有变量都在更新功能中更新，并且时钟在不运行的情况下工作。 所以我知道唯一的错误是我调用 setTimeout 函数的地方。

 const weekDays = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']; let date = new Date(); function formatNumber(number) { return number < 10 ? "0" + number : number; } function renew() { for (let i = 0; i < weekDays.length; i++) { if (date.getDay() === i) { document.getElementById("day").innerText = weekDays[i]; } } document.getElementById("hours").innerText = formatNumber(date.getHours()); document.getElementById("mins").innerText = formatNumber(date.getMinutes()); document.getElementById("secs").innerText = formatNumber(date.getSeconds()); if (date.getHours() > 0 && date.getHours() < 12) { document.getElementById("period").innerText = "AM"; } else { document.getElementById("period").innerText = "PM"; } window.setTimeout(renew, 500); } renew();

 <html lang="en"> <head> <meta charset="UTF-8"> <title>Digital Clock</title> <link rel="stylesheet" href="style.css"> </head> <body> <div id="clock"> <!-- Time units wrapper --> <span class="wrap-time"> <!-- Time unit - Day --> <span class="time-unit"> <span id=day class="large day">Mon</span> <span class="small">DAY</span> </span> <!-- Time unit - Hours --> <span class="time-unit"> <span id=hours class="large hours">00</span> <span class="small">HOURS</span> </span> <span class="separator">:</span> <!-- Time unit - Minutes --> <span class="time-unit"> <span id=mins class="large minutes">00</span> <span class="small">MINUTES</span> </span> <span class="separator">:</span> <!-- Time unit - Seconds --> <span class="time-unit"> <span id="secs" class="large seconds">00</span> <span class="small">SECONDS</span> </span> <!-- Time unit - Period --> <span class="time-unit"> <span id=period class="large period">AM</span> <span class="small">PERIOD</span> </span> </span> </div> </body> </html>

Answer 1

您的更新功能应首先更新日期，然后进一步使用它。

function renew() {
   date=new Date();
   for (let i = 0; i < weekDays.length; i++) {
     if (date.getDay() === i) {
       document.getElementById("day").innerText = weekDays[i];
    }
   }

  document.getElementById("hours").innerText = formatNumber(date.getHours());
  document.getElementById("mins").innerText = formatNumber(date.getMinutes());
  document.getElementById("secs").innerText = formatNumber(date.getSeconds());

  if (date.getHours() > 0 && date.getHours() < 12) {
    document.getElementById("period").innerText = "AM";
  } else {
    document.getElementById("period").innerText = "PM";
  }
  window.setTimeout(renew, 500);
 }

setTimeout() 运行函数但日期未更新

问题描述

1 个解决方案

解决方案1
0 2019-12-03 12:11:37

setTimeout() 运行函数但日期未更新

问题描述

1 个解决方案

解决方案1 0 2019-12-03 12:11:37

解决方案1
0 2019-12-03 12:11:37