Клавиша / esc

reset

Событие для сброса введённых данных.

Время чтения: меньше 5 мин

Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

Кратко

Скопировано

<input type="reset"> создаёт кнопку сброса. При нажатии на неё возникает событие reset. Оно нужно, чтобы вернуть значения полей формы к значениям по умолчанию.

Пример

Скопировано

При нажатии на кнопку «Сбросить значение» в поле формы появится значение по умолчанию «Имя»:

        
          
          <form>  <input type="text" name="name" value="Имя">  <input type="reset" value="Сбросить значение">  <input type="submit" value="Отправить"></form>
          <form>
  <input type="text" name="name" value="Имя">
  <input type="reset" value="Сбросить значение">
  <input type="submit" value="Отправить">
</form>

        
        
          
        
      

В этом примере в текстовом поле нет атрибута value. При нажатии на кнопку «Сбросить значение» поле формы станет пустым:

        
          
          <form>  <input type="text" name="name">  <input type="reset" value="Сбросить значение">  <input type="submit" value="Отправить"></form>
          <form>
  <input type="text" name="name">
  <input type="reset" value="Сбросить значение">
  <input type="submit" value="Отправить">
</form>

        
        
          
        
      

Как понять

Скопировано

Когда пользователь нажимает на кнопку «Сбросить значение», браузер создаёт событие. Чтобы получить доступ к объекту события, на reset нужно подписаться и передать объект события в функцию-обработчик:

        
          
          const form = document.querySelector('.form')form.addEventListener('reset', function (evt) {  console.log(evt)})
          const form = document.querySelector('.form')
form.addEventListener('reset', function (evt) {
  console.log(evt)
})