Клиентские сценарии в Web сети (стр. 5 )

Методы объекта form: submit(), reset().

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

Для большинства элементов значение этого свойства равно значению атрибута TYPE тэга INPUT, который был задействован для создания данного элемента. Однако есть исключения:

·  Для элемента <TEXTAREA> свойство type будет иметь значение textarea

·  Для элемента <SELECT> свойство type будет иметь значение select-one

·  Для элемента <SELECT> с атрибутом MULTIPLE свойство type будет иметь значение select-multiple

Пример просмотра типов всех элементов формы:

function doClick()

{ s=’’; for (i=0; i<document. forms[0].length; i++)

{ s=s+ ‘\n’+document. forms[0].elements[i].type }

alert(s) }

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

Текстовая строка и строка для ввода пароля. Эти объекты (text и password) имеют следующие свойства:

Свойство	Описание
name	Имя данного элемента. Также используется как имя объекта, представляющего данный элемент формы
defaultValue	Значение по умолчанию, соответствует значению атрибута VALUE соответствующего тэга. Доступно только для чтения
value	Текущее значение. Изначально имеет то же значение, что и defaultValue, но м. б. изменено

и методы:

Метод	Описание
focus()	Устанавливает фокус на данное поле
blur()	Действия, обратные методу focus()

Т. к. свойство value текстовых строк (text и password) является объектом string, то можно использовать все методы этого объекта.

Многострочный текст. Задается тэгом <TEXTAREA> и соответствующим ему объектом textarea. Имеет те же свойства, методы и события, что текстовая строка. Единственное отличие в том, что свойство value содержит несколько строк, разделенных символами конца строки: для Windows это \r\n, а для UNIX и Mac - \n. При обработке строк это необходимо учитывать и проверять оба типа разделителей. При вводе строк из программы JavaScript автоматически подставляет символы конца строки, используемые для данной платформы.

Кнопки с независимой фиксацией. Массив-объект checkbox имеет следующие свойства:

Свойство	Описание
name	Имя данного элемента. Также используется как имя объекта, представляющего данный элемент формы
value	Значение, присвоенное кнопке. Используется сервером. Программы на JS должны обращаться к свойству checked
defaultChecked	Значение по умолчанию, присваиваемое атрибутом CHECKED
checked	Текущее значение. (true – вкл., false – выкл.)

Кнопка с независимой фиксацией имеет один метод – click(), который имитирует ее нажатие и один обработчик – onClick. Следует отметить, что этот обработчик вызывается при включении и выключении кнопки.

Кнопки с зависимой фиксацией. Массив-объект radio имеет свойства:

Свойство	Описание
name	Имя группы кнопок
length	Число кнопок с независимой фиксацией в группе

Для доступа к конкретной кнопке объект рассматривается как массив. Каждая кнопка имеет свой индекс, начиная с нуля. Каждая кнопка имеет свойства:

Свойство	Описание
value	Значение, присвоенное кнопке. Используется сервером
defaultChecked	Наличие атрибута CHECKED – начальное состояние
checked	Текущее состояние кнопки (true – false)

Как и кнопки с независимой фиксацией, кнопки radio имеют метод click() и обработчик onClick. Каждая кнопка может иметь свой собственный обработчик.

Списки выбора. Списки (объект select) напоминают кнопки с зависимой фиксацией. Данные для каждого элемента хранятся в массиве options.

Объект select имеет свойства:

Свойство	Описание
name	Имя списка
length	Число элементов списка
options	Массив элементов списка
selectedIndex	Индекс текущего выбранного элемента

Массив options имеет одно свойство length. Каждый элемент списка, в свою очередь, имеет свойства:

Свойство	Описание
index	Индекс элемента в массиве
defaultSelected	Наличие атрибута SELECTED
selected	Текущее состояние элемента
name	Значение атрибута NAME
text	Текст для данного элемента
value	Значение, присвоенное кнопке. Используется сервером

Объект select имеет два метода – blur() и focus(). Обработчики onBlur, onFocus, onChange.

Коллекция images

Открывает доступ ко всем графическим изображениям в документе:

document. images(0), document. images(“img1”), document. img1

Свойство	Описание
border	Атрибут BORDER тэга IMG
height	Высота изображения
width	Ширина
name	Атрибут NAME тэга IMG
src	Атрибут SRC тэга IMG

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

Интерактивные страницы должны реагировать на действия пользователя. Например, при нажатии на кнопку появляется диалоговое окно с сообщением, или выполняется проверка введенных пользователем данных в полях формы.

В JavaScript подобная интерактивность реализована возможность перехвата и обработки событий, возникающих в результате действий пользователя. Для этого в тэги некоторых элементов (объектов JavaScript) введены параметры обработки событий, задающие действия, выполняемые при возникновении события, связанного с элементом. Имя параметра обработки события начинается с приставки on, за которой следует название события. В таблицы представлены возможные события, и в каких элементах документа HTML они могут инициализироваться.

Событие	Применяется к объектам	Когда происходит событие	Обработчик события
Abort	image	Пользователь отказывается от загрузки изображения	onAbort
Blur	window и все объекты формы	Потеря объектом фокуса	onBlur
Change	text, textarea, select	Пользователь изменяет значение элемента	onChange
Click	button, radio, checkbox, submit, reset, link	Щелчок на элементе формы или связи	onClick
DragDrop	window	Пользователь перетаскивает мышью объект в окно браузера, например файл	onDragDrop
Error	image, window	Загрузка документа или изображения вызывает ошибку	onError
Focus	window и все объекты формы	Окно или элемент формы получает фокус	onFocus
KeyDown	document, image, link, textarea	Пользователь нажимает клавишу клавиатуры	onKeyDown
KeyPress	document, image, link, textarea	Пользователь удерживает нажатой клавишу клавиатуры	onKeyPress
KeyUp	document, image, link, textarea	Пользователь отпускает клавишу клавиатуры	onKeyUp
Load	Тело документа	Загружает документ в браузер	onLoad
MouseDown	document, button, link	Пользователь нажимает кнопку мыши	onMouseDown
MouseMove	Никакой	Пользователь перемещает курсор мыши	onMouseMove
MouseOut	area, link	Пользователь перемещает курсор из области изображения или со связи	onMouseOut
MouseOver	link	Пользователь перемещает курсор над связью	onMouseOver
MouseUp	document, button, link	Пользователь отпускает кнопку мыши	onMouseUp
Move	window	Пользователь или сценарий перемещает окно	onMove
Reset	form	Пользователь нажимает кнопку Reset формы	onReset
Resize	window	Пользователь или сценарий изменяет размеры окна	onResize
Select	text, textarea	Пользователь выбирает поле ввода элемента формы	onSelect
Submit	form	Пользователь нажимает кнопку Submit формы	onSubmit
Unload	Тело документа	Пользователь закрывает документ	onUnload

Объект event