每周重新启动计数器

Question

我想创建一个每周重置的计数器，我发现一个或多或少有效的代码，但是当它变为 0 时，它显示为负数.... -1d -1h -2m -5s

            <script>
            // Set the date we're counting down to
            var countDownDate = new Date("Jan 29, 2021 20:21:0").getTime();

            // Update the count down every 1 second
            var x = setInterval(function() {

            // Get todays date and time
            var now = new Date().getTime();

            // Find the distance between now an the count down date
            var distance = countDownDate - now;

            // Time calculations for days, hours, minutes and seconds
            var days = Math.floor(distance / (1000 * 60 * 60 * 24));
            var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((distance % (1000 * 60)) / 1000);

            // Display the result in the element with id="demo"
            document.getElementById("demo").innerHTML = days + "d " + hours + "h "
            + minutes + "m " + seconds + "s ";

            // If the count down is finished, write some text
            if (distance < 0) {
                //document.getElementById("demo").innerHTML = "GAME DAY";
                if(distance < - 1000 * 60 * 60* 24){ // if its past the "game day"
                    // reset timer to next week
                    countDownDate += 1000 * 60 * 60 * 24 * 7
                }
            }
        }, 1000);
      </script>
      <span id="demo"></span>

Answer 1

您需要根据当前日期计算下一个日期，而不是对日期进行硬编码。

类似这样，不过最好将幻数（5 和 20）移动到变量中。

let getNextGameDayTime = function() {
  let now = new Date();
  let dayOfTheWeek = now.getDay();
  let dayOffset = 5 - dayOfTheWeek; // Friday is the 5th day of the week
  if (dayOffset < 0 || (dayOffset === 0 && now.getHours() > 20)) {
   dayOffset += 7;
  }
  let result = new Date();
  result.setDate(result.getDate() + dayOffset);
  result.setHours(20);
  result.setMinutes(0);
  result.setSeconds(0);
  result.setMilliseconds(0);
  return result;
}

console.log(getNextGameDayTime());

至于倒计时结束后一小时内不显示消息，您可以使用由此产生的距离。