Как очистить (сбросить) HTML-форму на jQuery?

Вопрос

У меня есть форма, в которой есть стандартная кнопка сброса (ресета), вот она:

<input type="reset" class="button standard" value="Очистить" />

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

Я думаю, что можно с помощью jQuery пробежаться по всем полям формы и задать им значения по-умолчанию, «обратившись», так сказать, к каждому полю «лично», но мне почему-то кажется, что должен существовать какой-то более эффективный и менее избыточный метод.

Буду рад любым предложениям.


Ответ №1

Это должно сработать (‘myform’ - это ID Вашей формы):

$(':input','#myform')
 .not(':button, :submit, :reset, :hidden')
 .val('')
 .removeAttr('checked')
 .removeAttr('selected');

Пояснение. Используем селектор ‘:input’ для того, чтобы получить все INPUT-ы (поля ввода, кнопки, флажки, поля выбора и т.п.) из нашей формы (её ID мы передаём втором параметром: #myform). Дальше отсеиваем все кнопки, ресеты, скрытые поля ввода используя селектор .not(). Затем мы очищаем значение полей с помощью функции .val(), передав туда пустую строку. Также используем removeAttr(), чтобы убрать галочки с флажков (чекбоксов) и полей выбора (селектов).

5 комментария

Добавить комментарий


(обязательно)