reset

Событие 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)
  })