Проблема с выбором даты в селектах

Question

В браузере выводит только текущую дату, изменить не получается, как и проверить например корректность даты при выборе не високосного года

let year = document.querySelector('#year-select')
let month = document.querySelector('#month-select')
let day = document.querySelector('#day-select')

let date = new Date()
let currentYear = date.getFullYear()
let currentMonth = date.getMonth()+1
let currentDay = date.getDate()

addOptions(year, range(currentYear - 10, currentYear + 10))
addOptions(month, range(1, 12))
addOptions(day, range(1, 31))

year.value = currentYear
month.value = currentMonth
day.value = currentDay

year.addEventListener('focus', selectFocusHandle)
month.addEventListener('focus', selectFocusHandle)
day.addEventListener('focus', selectFocusHandle)

year.addEventListener('change', selectChangeHandle)
month.addEventListener('change', selectChangeHandle)
day.addEventListener('change', selectChangeHandle)



function selectChangeHandle() {
//скорее всего проблема тут,постоянно выводится второе условие,может функция checkDate  неверно корректирует дату
    if (checkDate(year.value, month.value, day.value)) { 
        console.log('Correct date')
    } else {
        console.log('Incorrect date')
        this.value = this.dataset.default
    }

}

function selectFocusHandle() {
    this.dataset.default = this.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

}

function range(from, to) {
    let result = []
    for (let i = from; i <= to; i++) {
        result.push(i)
    }
    return result
}



function addOptions(select, arr) {
    arr.map((elem) => select.add(new Option(elem)))
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">


    <select id=year-select></select>
    <select id="month-select"></select>
    <select id="day-select"></select>
</head>
<body>

</body>

<script src='example108.js'>

</script>

</html>

Answer 1

Проблема тут:

 return date.getFullYear() === year && date.getMonth() === month - 1 && date.getDate === day

Вы сравниваете числа со строками строгим равенством.. Плюс не вызываете функцию getDate

let year = document.querySelector('#year-select')
let month = document.querySelector('#month-select')
let day = document.querySelector('#day-select')

let date = new Date()
let currentYear = date.getFullYear()
let currentMonth = date.getMonth()+1
let currentDay = date.getDate()

addOptions(year, range(currentYear - 10, currentYear + 10))
addOptions(month, range(1, 12))
addOptions(day, range(1, 31))

year.value = currentYear
month.value = currentMonth
day.value = currentDay

year.addEventListener('focus', selectFocusHandle)
month.addEventListener('focus', selectFocusHandle)
day.addEventListener('focus', selectFocusHandle)

year.addEventListener('change', selectChangeHandle)
month.addEventListener('change', selectChangeHandle)
day.addEventListener('change', selectChangeHandle)



function selectChangeHandle() {
//скорее всего проблема тут,постоянно выводится второе условие,может функция checkDate  неверно корректирует дату
    if (checkDate(year.value, month.value, day.value)) { 
        console.log('Correct date')
    } else {
        console.log('Incorrect date')
        this.value = this.dataset.default
    }

}

function selectFocusHandle() {
    this.dataset.default = this.value
}

function checkDate(year, month, day) {
    let date = new Date(year, month - 1, day)
    return date.getFullYear() === parseInt(year) && date.getMonth() === month - 1 && date.getDate() === parseInt(day)

}

function range(from, to) {
    let result = []
    for (let i = from; i <= to; i++) {
        result.push(i)
    }
    return result
}



function addOptions(select, arr) {
    arr.map((elem) => select.add(new Option(elem)))
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">


    <select id=year-select></select>
    <select id="month-select"></select>
    <select id="day-select"></select>
</head>
<body>

</body>

<script src='example108.js'>

</script>

</html>

БЛОГ НА HUSL

Проблема с выбором даты в селектах

Ответы (1 шт):