дата ввода — предварительный выбор года без установки значения?

#html #forms #datepicker

Вопрос:

<input type="date" name="birthday" id="birthdate" required="">

Я хотел бы предварительно выбрать год выбора даты (скажем, 16 лет назад), чтобы пользователям, возможно, не нужно было начинать с сегодняшней даты, возвращаясь к своему году рождения.

Если я использую value="2005-01-01" предварительно выбранную дату, но также ввод имеет :valid значение, поэтому поле не будет отображаться со :invalid стилем (поскольку это обязательное поле, оно имеет другой стиль с :invalid селектором, если оно пустое или имеет неправильный синтаксис). Таким образом, в принципе, это поле больше не будет обязательным, потому что оно имеет допустимое значение, и пользователю не нужно будет вводить или изменять дату, чтобы отправить форму.

Есть какие-нибудь предложения?

Ответ №1:

Лучшее, что вы можете сделать, это использовать JavaScript для изменения года, когда вводится информация. Вот так:

 var chosenYear = 2000;
var datepicker = document.getElementById("birthdate");
datepicker.addEventListener("change", ()=>{
  datepicker.value = chosenYear datepicker.value.substring(4);
}) 
 Please choose your birthdate. <b>The year will automatically be set to 2000.</b>
<br/><br/>
<input type="date" name="birthday" id="birthdate" required=""> 

Комментарии:

1. это не позволило бы выбрать другой год, чем 2000.

2. onfocus=»(this.value=’2005-01-01′)» — лучшее, что я нашел до сих пор. Но это все равно не гарантирует, что пользователь введет дату рождения / заполнит поле.