мое новое расписание: пн-пт с 8.00 по 16.00 по москве, сб и вс - выходные; после 16.00 и на вых. отвечаю по возможности

Запрет выбора некорректной даты в селектах

Пусть у нас есть три селекта, с помощью которых мы можем выбрать год, месяц и день. Давайте сделаем так, чтобы с помощью наших селектов нельзя было выбрать некорректную дату, например, 30 февраля или 31 апреля.

Исходники кода

<select id="year-select"></select> <select id="month-select"></select> <select id="day-select"></select> let yearSelect = document.querySelector('#year-select'); let monthSelect = document.querySelector('#month-select'); let daySelect = document.querySelector('#day-select'); let date = new Date(); let currentYear = date.getFullYear(); let currentMonth = date.getMonth() + 1; let currentDay = date.getDate(); fillSelect(yearSelect, range(currentYear - 10, currentYear + 10)); fillSelect(monthSelect, range(1, 12)); fillSelect(daySelect, range(1, 31)); yearSelect.value = currentYear; monthSelect.value = currentMonth; daySelect.value = currentDay; yearSelect.addEventListener('focus', selectFocusHandle); monthSelect.addEventListener('focus', selectFocusHandle); daySelect.addEventListener('focus', selectFocusHandle); yearSelect.addEventListener('change', selectChangeHandle); monthSelect.addEventListener('change', selectChangeHandle); daySelect.addEventListener('change', selectChangeHandle); function selectChangeHandle() { if (checkDate(yearSelect.value, monthSelect.value, daySelect.value)) { console.log('yes'); } else { console.log('no'); this.value = this.dataset.default; } } function selectFocusHandle() { this.dataset.default = this.value; } function fillSelect(select, arr) { arr.forEach(function(elem) { select.add(new Option(elem)); }); } function range(from, to) { let result = []; for (let i = from; i <= to; i++) { result.push(i); } return result; } //select.add(new Option('text', 'value')); function checkDate(year, month, day) { let date = new Date(year, month - 1, day); return date.getFullYear() == year && date.getMonth() == month - 1 && date.getDate() == day; }

:

Смотрите также