Книга: JavaScript. Подробное руководство, 6-е издание

15.9.3. Обработчики событий форм и их элементов

15.9.3. Обработчики событий форм и их элементов

Каждый элемент Form имеет обработчик события onsubmit, возникающего в момент отправки формы, и обработчик события onreset, возникающего в момент сброса формы в исходное состояние. Обработчик onsubmit вызывается непосредственно перед отправкой формы. Он может отменить отправку, вернув значение false. Это дает JavaScript-программам возможность проверить ввод пользователя и избежать отправки неполных или ошибочных данных серверной программе. Обратите внимание, что обработчик onsubmit вызывается только в случае щелчка мышью на кнопке Submit. Вызов метода submit() формы не приводит к вызову обработчика onsubmit.

Обработчик событий onreset похож на обработчик onsubmit. Он вызывается непосредственно перед сбросом формы в исходное состояние и может предотвратить сброс элементов формы, вернув значение false. Кнопки Reset редко используются в формах, но если у вас имеется такая кнопка, возможно, у вас появится желание запросить у пользователя подтверждение, прежде чем выполнить сброс:

<form...
 >
  <button type="reset">Очистить поля ввода и начать сначала</button>
</form>

Подобно обработчику onsubmit, обработчик onreset вызывается только в случае щелчка мышью на кнопке Reset. Вызов метода reset() формы не приводит к вызову обработчика onreset.

Элементы форм обычно возбуждают событие click или change, когда пользователь взаимодействует с ними, и вы можете реализовать обработку этих событий, определив обработчик onclick или onchange. В третьем столбце таблицы 15.1 для каждого элемента формы указан основной обработчик событий. Вообще говоря, элементы форм, являющиеся кнопками, возбуждают событие click в момент активации (даже когда активация производится посредством нажатия клавиши на клавиатуре, а не щелчком мышью). Другие элементы форм возбуждают событие change, когда пользователь изменяет содержимое, представляемое элементом. Это происходит, когда пользователь вводит текст в текстовое поле или выбирает элемент раскрывающегося списка. Обратите внимание, что это событие возбуждается не каждый раз, когда пользователь нажимает клавишу, находясь в текстовом поле ввода. Оно возбуждается, только когда пользователь изменит значение элемента и перенесет фокус ввода в другой элемент. То есть этот обработчик событий вызывается по завершении ввода. Радиокнопки и флажки являются кнопками, хранящими информацию о своем состоянии, и все они возбуждают события click и change; из них событие change имеет большее практическое значение.

Элементы форм также возбуждают событие focus, когда они получают фокус ввода, и событие blur, когда теряют его.

Важно знать, что внутри обработчика события ключевое слово this всегда ссылается на элемент документа, вызвавший данное событие (подробнее об этом будет рассказываться в главе 17). Во всех элементах форм имеется свойство form, ссылающееся на форму, в которой содержится элемент, поэтому обработчики событий элемента формы всегда могут обратиться к объекту Form, как к this.form. Сделав еще один шаг, мы можем сказать, что обработчик событий для одной формы может ссылаться на соседний элемент формы, имеющий имя х, как this.form.х.

Оглавление книги