基于天的倒数计时器?

时间:2019-06-10 16:45:48

标签: javascript jquery html

我正在尝试创建一个倒计时计时器,该计时器从星期一到星期三,星期三到星期五以及星期五到星期一开始计时。除了实际的日值外,其他一切似乎都可以正常运行。计算不正确。

在我将其设置为仅倒计时到星期一之前,这对我来说很好。这是我所遵循的代码-https://vincoding.com/weekly-repeating-countdown-timer-javascript/

var curday;
var secTime;
var ticker;

function getSeconds() {
  var nowDate = new Date();
  var destinationDay;
  var weekDay = nowDate.getDay();
  if (nowDate.getHours() >= 24) {
    weekDay++;
  }
  // in case it is Saturday after 8PM we would have a 7 as week day which should be changed to 0 (sunday).
  weekDay = weekDay % 7;

  if (weekDay > 1 && weekDay <= 3) {
    destinationDay = 3;
  } else if (weekDay > 3 && weekDay <= 5) {
    destinationDay = 5;
  } else {
    destinationDay = 1;
  }

  var counterTime = new Date();
  // calculate the date by adding an offset based on current and target date.
  counterTime.setDate(counterTime.getDate() + (destinationDay + 7 - weekDay) % 7);
  counterTime.setHours(24);
  counterTime.setMinutes(0);
  counterTime.setSeconds(0);

  var currentTime = nowDate.getTime(); //current time
  var destinationTime = counterTime.getTime(); //countdown time
  var diff = parseInt((destinationTime - currentTime) / 1000);
  startTimer(diff);
}

function startTimer(secs) {
 secTime = parseInt(secs);
 ticker = setInterval("tick()",1000);
 tick(); //initial count display
}

function tick() {
 var secs = secTime;
 if (secs>0) {
  secTime--;
 }
 else {
  clearInterval(ticker);
  getSeconds(); //start over
 }

 var days = Math.floor(secs/86400);
 secs %= 86400;
 var hours= Math.floor(secs/3600);
 secs %= 3600;
 var mins = Math.floor(secs/60);
 secs %= 60;

 //update the time display
 document.getElementById("days").innerHTML = days;
 document.getElementById("hours").innerHTML = ((hours < 10 ) ? "0" : "" ) + hours;
 document.getElementById("minutes").innerHTML = ( (mins < 10) ? "0" : "" ) + mins;
 document.getElementById("seconds").innerHTML = ( (secs < 10) ? "0" : "" ) + secs;
}

$( document ).ready(function() {
  getSeconds();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="countholder">
 <div><span class="days" id="days"></span><div class="smalltext">Days</div></div>
 <div><span class="hours" id="hours"></span><div class="smalltext">Hours</div></div>
 <div><span class="minutes" id="minutes"></span><div class="smalltext">Minutes</div></div>
 <div><span class="seconds" id="seconds"></span><div class="smalltext">Seconds</div></div>
</div>

它应该倒数每一天,并在午夜之后移到新的一天。

0 个答案:

没有答案
相关问题