Сброс формы: возврат к исходным значениям, а не обязательная очистка

Назначение

Reset возвращает элементы формы к их исходным значениям. Если разметка задаёт начальный текст или отмеченный переключатель, сброс восстановит их, а не оставит всё пустым.

Как это работает

Нативная кнопка type="reset" запускает сброс своей формы. Исходные значения задаются разметкой и соответствующими default-свойствами. Пользовательское состояние компонентов и сообщения приложения могут требовать отдельной синхронизации.

Пример

<form><p><label>Название <input name="title" value="Первый урок"></label></p><p><label><input type="checkbox" name="examples" checked> Показывать примеры</label></p><button type="reset">Вернуть исходные значения</button></form>

Что должно получиться

После изменения текста и чекбокса кнопка восстанавливает первоначальное состояние. Здесь нет отправки формы и нет удаления данных с сервера.

Граница применения и частая ошибка

Не ставьте случайно reset вместо submit. На длинной форме неосторожное нажатие может потерять введённые пользователем данные, поэтому такая кнопка нужна не всегда. Сброс не отменяет ранее выполненные сетевые операции.

Самостоятельная проверка

Измените оба поля, выполните сброс и сравните значения с исходной разметкой. Затем измените значение по умолчанию в отдельном тесте. Решите, нужна ли вашему реальному сценарию кнопка полного сброса.

Связанные материалы

• Локальный просмотр
• Вычисленные стили
• Повторная проверка