Кратко
Скопировано<input type создаёт кнопку сброса. При нажатии на неё возникает событие 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)
})