Я адаптирую учебник по коду из здесь , чтобы создать таймер обратного отсчета с несколькими повторяющимися событиями. Это хорошая отправная точка, но мне нужно ее изменить, чтобы сделать следующее: 1. Проведите четыре мероприятия, которые повторяются каждую неделю. 2. Каждое событие имеет уникальный день недели и время. 3. Часовой пояс должен отражать стандартное время Pacifi c. 4. Когда обратный отсчет достигает нуля, таймер начинает обратный отсчет до следующего события недели.
Я довольно новичок в javascript.
Вот вилка, из которой я сделал учебник, на который я ссылался выше:
function getTimeRemaining(endtime) {
var t = Date.parse(endtime) - Date.parse(new Date());
var seconds = Math.floor((t / 1000) % 60);
var minutes = Math.floor((t / 1000 / 60) % 60);
var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
var days = Math.floor(t / (1000 * 60 * 60 * 24));
return {
'total': t,
'days': days,
'hours': hours,
'minutes': minutes,
'seconds': seconds
};
}
function initializeClock(id, endtime) {
var clock = document.getElementById(id);
clock.style.display = 'block';
var daysSpan = clock.querySelector('.days');
var hoursSpan = clock.querySelector('.hours');
var minutesSpan = clock.querySelector('.minutes');
var secondsSpan = clock.querySelector('.seconds');
function updateClock() {
var t = getTimeRemaining(endtime);
daysSpan.innerHTML = t.days;
hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
}
}
updateClock();
var timeinterval = setInterval(updateClock, 1000);
}
var schedule = [
['Jul 25 2015', 'Sept 20 2020'],
['Sept 21 2015', 'Jul 25 2020'],
['Jul 25 2016', 'Jul 25 2019']
];
// iterate over each element in the schedule
for(var i=0; i<schedule.length; i++){
var startDate = schedule[i][0];
var endDate = schedule[i][1];
// put dates in milliseconds for easy comparisons
var startMs = Date.parse(startDate);
var endMs = Date.parse(endDate);
var currentMs = Date.parse(new Date());
// if current date is between start and end dates, display clock
if(endMs > currentMs && currentMs >= startMs ){
initializeClock('clockdiv', endDate);
}
}