Как сбросить интервал jquery - PullRequest
0 голосов
/ 09 апреля 2020

У меня проблема с перезапуском интервала после clearInterval. Когда difference равно <= 0, интервал должен перезапуститься. Я попытался позвонить timer() снова после clearinterval, но это не работает. Может быть проблема с timeBetweenDates? Или countDownDate?

(function($) {
  function getNextDayOfWeek(date, dayOfWeek, hour) {
    var resultDate = new Date(date.getTime());
    resultDate.setDate(date.getDate() + (7 + dayOfWeek - date.getDay()) % 7);
    resultDate.setHours(hour, 0, 0, 0);
    return resultDate;
  }

  var countDownDate = getNextDayOfWeek(new Date(), 4, 12);
  var timer;
  var compareDate = new Date();
  compareDate.setDate(compareDate.getDate() + 7); //just for this demo today + 7 days

  timer = setInterval(function() {
    timeBetweenDates(compareDate);
  }, 1000);
  timer2 = setInterval(function() {
    timeBetweenDates(compareDate);
  }, 1000);

  function timeBetweenDates(toDate) {
    var now = new Date().getTime();
    var difference = countDownDate - now;
    var difference2 = countDownDate2 - now;

    if (difference <= 0) {
      // Timer done
      clearInterval(timer);
      timer();
    } else {
      var seconds = Math.floor(difference / 1000);
      var minutes = Math.floor(seconds / 60);
      var hours = Math.floor(minutes / 60);
      var days = Math.floor(hours / 24);

      hours %= 24;
      minutes %= 60;
      seconds %= 60;

      if (days == 0) {
        $(".days-text").css("display", "none");
      } else {
        $(".days").text(days);
      }

      if (minutes == 0) {
        $(".minutes-text").css("display", "none");
      } else {
        $(".minutes").text(days);
      }

      $(".hours").text(hours);
      $(".minutes").text(minutes);
      $(".seconds").text(seconds);
    }
  }
})(jQuery);

1 Ответ

1 голос
/ 09 апреля 2020

таймер не является функцией, поэтому timer () не запустит его снова

Вы имеете в виду это?

const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };

let timer;
const getNextDayOfWeek = (date, dayOfWeek, hour) => {
  var resultDate = new Date(date.getTime());
  if (date.getDay() === dayOfWeek && date.getHours() >= hour) resultDate.setDate(resultDate.getDate()+1)
  resultDate.setDate(resultDate.getDate() + (7 + dayOfWeek - resultDate.getDay()) % 7);
  resultDate.setHours(hour, 0, 0, 0);
  document.getElementById("date").innerText = "Odliczanie do "+ resultDate.toLocaleDateString('pl-PL', options) + " " + resultDate.toLocaleTimeString('pl-PL') ;
  return resultDate;
}
let countdownDate = getNextDayOfWeek(new Date(),4,12);

function timeBetweenDates(toDate) {

  var now = new Date().getTime();
  var difference = countdownDate - now;
  if (difference <= 0) {
    countdownDate =  getNextDayOfWeek(new Date(),4,12);
  } else {

    var seconds = Math.floor(difference / 1000);
    var minutes = Math.floor(seconds / 60);
    var hours = Math.floor(minutes / 60);
    var days = Math.floor(hours / 24);

    hours %= 24;
    minutes %= 60;
    seconds %= 60;
    $(".days-text").toggle(days > 0);
    $(".days").text(days ? days : "");
    $(".hours-text").toggle(hours > 0);
    $(".hours").text(hours ? hours : "");
    $(".minutes-text").toggle(minutes > 0)
    $(".minutes").text(minutes ? minutes : "");
    $(".seconds").text(seconds);
  }
}

$(function() {
  timer = setInterval(timeBetweenDates, 1000);
})
.days-text { display : none }
.hours-text { display : none }
.minutes-text { display : none }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id="date"></span><br/>
<span class="days"></span>
<span class="days-text">dni</span>
<span class="hours"></span>
<span class="hours-text">godziny</span>
<span class="minutes"></span>
<span class="minutes-text">minuty</span>
<span class="seconds"></span>

Тестирование в следующий четверг

const getNextDayOfWeek = (date, dayOfWeek, hour) => {
  var resultDate = new Date(date.getTime());
  if (date.getDay() === dayOfWeek && date.getHours() >= hour) resultDate.setDate(resultDate.getDate()+1)
  resultDate.setDate(resultDate.getDate() + (7 + dayOfWeek - resultDate.getDay()) % 7);
  resultDate.setHours(hour, 0, 0, 0);
  return resultDate;
}

let d = new Date()
console.log(d)
console.log(getNextDayOfWeek(d, 4, 12));


console.log("April 16")
d = new Date(2020, 3, 16, 15, 0, 0, 0); // April 16, a Thursday
console.log(d);
console.log(getNextDayOfWeek(d, 4, 12));

console.log("April 17")
d = new Date(2020, 3, 17, 15, 0, 0, 0); // April 17, a Friday
console.log(d);
console.log(getNextDayOfWeek(d, 4, 12));

console.log("April 22")
d = new Date(2020, 3, 22, 15, 0, 0, 0); // April 2, a Wednesday
console.log(d);
console.log(getNextDayOfWeek(d, 4, 12));
...