Таймер обратного отсчета
коллеги, нужна помощь... пишу таймер обратного отсчета... но завис на одной проблеме... помогите пожалуйста... как на странице сделать поле для ввода даты, с кнопкой сабмит, и что бы таймер реагировал на это так, что бы после ввода таймер реагировал и начинал отсчета от сейчас до даты введенной пользователем... код, какой имею на данный момент прикрепляю... помогите пожалуйста решить проблему...
HTML <div class="timer"> <div class="timer__items"> <div class="timer__item timer__days">00</div> <div class="timer__item timer__hours">00</div> <div class="timer__item timer__minutes">00</div> <div class="timer__item timer__seconds">00</div> </div> </div> JS document.addEventListener('DOMContentLoaded', function () { const deadline = new Date(new Date().getFullYear(), new Date(), 01); let timerId = null; function declensionNum(num, words) { return words[(num % 100 > 4 && num % 100 < 20) ? 2 : [2, 0, 1, 1, 1, 2][(num % 10 < 5) ? num % 10 : 5]]; } function countdownTimer() { const diff = deadline - new Date(); if (diff <= 0) { clearInterval(timerId); } const days = diff > 0 ? Math.floor(diff / 1000 / 60 / 60 / 24) : 0; const hours = diff > 0 ? Math.floor(diff / 1000 / 60 / 60) % 24 : 0; const minutes = diff > 0 ? Math.floor(diff / 1000 / 60) % 60 : 0; const seconds = diff > 0 ? Math.floor(diff / 1000) % 60 : 0; $days.textContent = days < 10 ? '0' + days : days; $hours.textContent = hours < 10 ? '0' + hours : hours; $minutes.textContent = minutes < 10 ? '0' + minutes : minutes; $seconds.textContent = seconds < 10 ? '0' + seconds : seconds; $days.dataset.title = declensionNum(days, ['день', 'дня', 'дней']); $hours.dataset.title = declensionNum(hours, ['час', 'часа', 'часов']); $minutes.dataset.title = declensionNum(minutes, ['минута', 'минуты', 'минут']); $seconds.dataset.title = declensionNum(seconds, ['секунда', 'секунды', 'секунд']); } const $days = document.querySelector('.timer__days'); const $hours = document.querySelector('.timer__hours'); const $minutes = document.querySelector('.timer__minutes'); const $seconds = document.querySelector('.timer__seconds'); countdownTimer(); timerId = setInterval(countdownTimer, 1000); }); |
DenysV,
Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [html run] ... минимальный код страницы с вашей проблемой [/html] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Цитата:
https://javascript.ru/forum/search.php?searchid=441059 |
Часовой пояс GMT +3, время: 04:03. |