Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Лекции - JavaScript.docx
Скачиваний:
26
Добавлен:
23.08.2019
Размер:
401.56 Кб
Скачать

Текстовое поле ввода (объект Text)

Поля ввода (контейнер INPUT типа TYPE=text ) являются одним из наиболее популярных объектов программирования на JavaScript. Это объясняется тем, что, помимо использования по прямому назначению, их применяют и в целях отладки программ, выводя в эти поля промежуточные значения переменных и свойств объектов.

<A HREF="http://site.com/">ссылка 1</A>

<FORM>Число гипертекстовых ссылок к данному моменту:

<SCRIPT>

document.write('<INPUT NAME=t VALUE='+document.links.length+'>');

</SCRIPT>

<BR><INPUT TYPE=button

VALUE="Число ссылок по окончании загрузки страницы"

onClick="form.t.value=document.links.length;">

<BR><INPUT TYPE=reset>

</FORM>

<A HREF="http://rite.com/">ссылка 2</A>

Пример 5.2. (html, txt)

В данном примере первое поле формы - это поле ввода. Мы присваиваем ему значение по умолчанию, равное числу гипертекстовых ссылок, имеющихся выше этого места в HTML-документе. Затем при помощи кнопки изменяем это значение на общее количество гипертекстовых ссылок во всем HTML-документе.

С каждым текстовым полем ввода <INPUT TYPE=text> связан свой объект классаText, который является свойством той формы, в которой он был описан. Этот объект, в свою очередь, характеризуется следующими свойствами, методами и событиями:

Свойства, методы и события объекта Text

Свойства

Методы

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

defaultValue

value

size

maxLength

disabled

readOnly

focus()

blur()

select()

onChange

onSelect

onFocus

onBlur

onClick

onDblClick

onMouseOver

onMouseOut

onMouseDown

onMouseUp

onKeyPress

onKeyDown

onKeyUp

Все перечисленные свойства можно менять. Смысл их таков: value (текущее значение поля ввода), defaultValue (значение поля ввода по умолчанию), size(число умещающихся в поле символов, т.е. видимых) maxLength (максимальное число символов, которое можно присвоить значению данного поля) readOnly (может ли пользователь менять значение поля) disabled (может ли пользователь установить фокус на этом поле).

Опишем вкратце методы: focus() - устанавливает фокус на данном поле, blur() - убирает фокус с данного поля, select() - выделяет весь введенный текст (чтобы, например, его можно было скопировать в буфер, либо удалить, нажав клавишу Delete).

Смысл обработчиков событий вполне понятен из их названий: обработчик onChangeвызывается, когда пользователь (но не скрипт) изменил значение в поле ввода (и кликнул вне поля ввода); onSelect - когда пользователь начинает выделять текст, расположенный в поле; onFocus и onBlur - когда поле получает и теряет фокус, соответственно; onClick и onDblClick - когда пользователь совершил одинарный или двойной щелчок мышью на поле, соответственно. Вторая колонка событий - стандартна для большинства элементов HTML-страницы. Нужно лишь иметь в виду, что обработчики событий onMouseDown, onMouseUp, onKeyPress, onKeyDown, onKeyUpсрабатывают у того элемента формы, который в данный момент находится в фокусе.