#javascript #html #validation
Вопрос:
При создании средства выбора даты я настроил его так, чтобы разрешать только сегодня и далее. что работает… Но похоже, что пользователь может затем ввести вкладку в поле и изменить дату на «до» сегодня. Есть ли способ обеспечить соблюдение правила «должно быть сегодня или в будущем»?
Вот мой пример;
var today = new Date(); var d = today.getDate(); var m = today.getMonth() 1; var y = today.getFullYear(); if (d < 10) { d = '0' d } if (m < 10) { m = '0' m } today = y '-' m '-' d; document.getElementById("datePicker").setAttribute("min", today); <input id="datePicker" type='date' > Комментарии:
1. Если вы используете сервер, просто облегчите себе жизнь, выполнив определенную проверку на стороне сервера. Все, что находится на интерфейсе, может быть изменено пользователем.
2. Вы могли бы написать модуль… и вызвать его при смене средства выбора даты, чтобы выполнить проверку на стороне клиента, но в конце дня любой может открыть консоль, найти функцию и удалить ее.
Ответ №1:
используйте EventListener для прослушивания и установки значения ввода на сегодняшнюю дату, когда введенное значение меньше, чем сегодня
var today = new Date(); var d = today.getDate(); var m = today.getMonth() 1; var y = today.getFullYear(); if (d < 10) { d = '0' d } if (m < 10) { m = '0' m } today = y '-' m '-' d; const input = document.getElementById("datePicker") input.setAttribute("min", today); input.addEventListener('change', (event) => { const d1 = new Date(today); const d2 = new Date(event.target.value); if(d1.getTime() > d2.getTime()){ event.target.value = today } }); <input id="datePicker" type='date'> Комментарии:
1. Это прекрасно… Могу я все же спросить, для чего нужна эта
const same = d1.getTime() === d2.getTime();линия? Я нигде не вижу, чтобы эта переменная использовалась?2. (^_^) извините, это просто ошибка, позвольте мне удалить ее