Чтение онлайн

До появления JavaScript отправка форм выполнялась с помощью специальной кнопки

, а сброс значений элементов формы в значения по умолчанию - с помощью специальной кнопки . В языке JavaScript тем же целям служат два метода, и , объекта . Метод объекта отправляет форму, а метод сбрасывает элементы формы в исходное состояние.

У всех (или у большинства) элементов форм есть общие свойства, перечисленные далее. Кроме того, у некоторых элементов есть специальные свойства, которые будут описаны ниже, когда мы будем рассматривать элементы форм различных типов по отдельности.

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

, это свойство просто хранит значение атрибута . Другие элементы форм (такие как и ) также определяют свойство , благодаря чему его можно использовать в сценарии для идентификации элементов, подобно тому, как идентифицируются различные типы элементов . Значения этого свойства для каждого типа элементов форм перечислены во втором столбце табл. 15.1.

Доступная только для чтения ссылка на объект

, в котором содержится этот элемент, или null, если элемент не находится внутри элемента .

Доступная только для чтения строка, указанная в HTML-атрибуте name,

Доступная для чтения и записи строка, определяющая «значение», содержащееся в элементе формы или представляемое им. Эта строка отсылается на веб-сервер при передаче формы и только иногда представляет интерес для JavaScript-программ. Для элементов

и это свойство содержит введенный пользователем текст. Для кнопок, создаваемых с помощью тега (но не для кнопок, создаваемых с помощью тега ), это свойство определяет отображаемый на кнопке текст. Свойство для элементов переключателей (радиокнопок) и флажков не редактируется и никак не представляется пользователю. Это просто строка, устанавливаемая HTML-атрибутом . Эта строка предназначена для отправки веб-серверу, и ее можно использовать для передачи дополнительных данных. Свойство будет обсуждаться далее в этой главе, когда мы будем рассматривать различные категории элементов формы.

Каждый элемент

имеет обработчик события , возникающего в момент отправки формы, и обработчик события , возникающего в момент сброса формы в исходное состояние. Обработчик вызывается непосредственно перед отправкой формы. Он может отменить отправку, вернув значение . Это дает JavaScript-программам возможность проверить ввод пользователя и избежать отправки неполных или ошибочных данных серверной программе. Обратите внимание, что обработчик вызывается только в случае щелчка мышью на кнопке . Вызов метода формы не приводит к вызову обработчика .

Обработчик событий

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

Подобно обработчику

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

Элементы форм обычно возбуждают событие

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

Элементы форм также возбуждают событие

, когда они получают фокус ввода, и событие , когда теряют его.

Важно знать, что внутри обработчика события ключевое слово

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

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

. Кнопки, определяемые с помощью элементов , отображают простой текст, содержащийся в их свойстве .

Кнопки, определяемые с помощью элементов

отображают содержимое элемента.

Обратите внимание, что гиперссылки предоставляют такой же обработчик событий

, как и кнопки. Когда действие, выполняемое обработчиком , можно классифицировать как «переход по ссылке», используйте ссылку. В противном случае используйте кнопку.

Элементы

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