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

Флэнаган Дэвид
Шрифт:

<input type=”radio" name="method" value="2day">

3a 2 дня самолетом

</label>

<label>

<input type="radio" name="method" value=”overnite">

В течение ночи

</label>

</fieldset>

</form>

Сослаться на массив радиокнопок в этой форме можно следующим образом:

var methods = document.forms.shipping.elements.method;

Обратите внимание, что элементы

<form>
имеют HTML-атрибут и соответствующее ему свойство с именем «method», поэтому в данном случае необходимо использовать свойство
elements
формы вместо прямого обращения к свойству
method
. Чтобы определить, какой метод доставки выбрал пользователь, необходимо обойти элементы формы в массиве и проверить свойство
checked
каждого из них:

var shippingjnethod;

for(var і = 0; і < methods.length; і++)

if (methods[і].checked) shipping_method = methods[i].value;

Со свойствами элементов форм, такими как

checked
и
value
, мы поближе познакомимся в следующем разделе.

15.9.2. Свойства форм и их элементов

Наиболее интересным для нас свойством объекта

Form
является массив
elements[],
описанный выше. Остальные свойства объекта
Form
менее важны. Свойства
action
,
encoding, method
и
target
непосредственно соответствуют атрибутам
action, encoding, method
и
target
элемента
<form>.
Все эти свойства и атрибуты используются для управления отправкой данных формы на веб-сервер и отображением результатов. Клиентский сценарий на языке JavaScript может устанавливать значения этих свойств, но это имеет смысл, только когда форма действительно отправляется серверной программе.

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

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

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

type

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

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

form

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

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

name

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

value

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

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

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

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

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