Оглавление | Назад | Вперёд | Индекс

Text

Поле для ввода текста на HTML-форме. Пользователь может ввести в текстовое поле слово, фразу или последовательность цифр или символов.

Создание

HTML-тэгом INPUT с "text" в качестве значения атрибута TYPE. Для данной формы машина выполнения JavaScript создаёт соответствующие объекты Text и помещает эти объекты в массив elements соответствующего объекта Form. Доступ к Text-объекту Вы получаете по индексу в этом массиве. Можно индексировать числами или, если имеются, значениями атрибутов NAME.

Для определения Text-объекта используется стандартный синтаксис HTML с добавлением обработчиков событий JavaScript.

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

• onBlur
• onChange
• onFocus
• onSelect

Описание

Text-объект на форме выглядит так:

Text-объект это элемент формы и он обязан быть определён в тэге FORM.

Text-объекты могут быть обновлены (перерисованы) динамически через установку свойства value /(this.value).

Свойства. Резюме.

defaultValue

form

name

type

value

Методы. Резюме.

blur

focus

handleEvent

select

Кроме того, этот объект наследует методы watch и unwatch из объекта Object.

Примеры

Пример 1. Создаётся Text-объект длиной 25 символов. Текстовое поле расположено сразу справа от слов "Last name:". При загрузке формы текстовое поле очищено.

<B>Last name:</B> <INPUT TYPE="text" NAME="last_name" VALUE="" SIZE=25>

Пример 2. Создаются два Text-объекта на форме. Каждый объект имеет значение по умолчанию. Объект city имеет обработчик onFocus, который выделяет весь текст в поле, когда пользователь переходит в это поле с помощью табуляции. Объект state имеет обработчик onChange, который переводит значение в верхний регистр.

<FORM NAME="form1">
<BR><B>City: </B><INPUT TYPE="text" NAME="city" VALUE="Anchorage"
   SIZE="20" onFocus="this.select()">
<B>State: </B><INPUT TYPE="text" NAME="state" VALUE="AK" SIZE="2"
   onChange="this.value=this.value.toUpperCase()">
</FORM>

См. также примеры для onBlur, onChange, onFocus и onSelect.

См. также

blur

Убирает фокус с текстового поля.

Синтаксис

blur()

Параметры

Отсутствуют.

Пример

Убирается фокус с текстового элемента userText:

userText.blur()

Предполагается, что текстовый элемент определён так:

<INPUT TYPE="text" NAME="userText">

См. также

defaultValue

Строка со значением по умолчанию для объекта Text.

Безопасность

JavaScript 1.1. Это свойство разрушено по умолчанию. О разрушении данных см. книгу Клиентский JavaScript. Руководство.

Описание

Начальное значение defaultValue отражает значение атрибута VALUE. Установка defaultValue программно переопределяет начальную установку.

Вы можете установить свойство defaultValue в любое время. Вид соответствующего объекта не обновляется при установке свойства defaultValue, это происходит только при установке свойства value.

Пример

Функция вычисляет свойства defaultValue объекта на форме surfCity и отображает значения в окне msgWindow:

function defaultGetter() {
   msgWindow=window.open("")
   msgWindow.document.write("hidden.defaultValue is " +
      document.surfCity.hiddenObj.defaultValue + "<BR>")
   msgWindow.document.write("password.defaultValue is " +
      document.surfCity.passwordObj.defaultValue + "<BR>")
   msgWindow.document.write("text.defaultValue is " +
      document.surfCity.textObj.defaultValue + "<BR>")
   msgWindow.document.write("textarea.defaultValue is " +
      document.surfCity.textareaObj.defaultValue + "<BR>")
   msgWindow.document.close()
}

См. также

focus

Переходит к текстовому полю и передаёт ему фокус.

Синтаксис

focus()

Параметры

Отсутствуют.

Описание

Метод focus используется для перехода к текстовому полю и для передачи ему фокуса ввода. Вы можете затем программно ввести значение в это поле или дать возможность пользователю сделать это. Если этот метод используется без метода select, курсор позиционируется в начале поля.

Примеры

См. примеры для select.

См. также

form

Ссылка объекта, специфицирующая форму, содержащую данный объект.

Описание

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

Примеры

Пример 1. Форма myForm содержит Text-объект и кнопку. если пользователь щёлкает по кнопке, в Text-объект устанавливается значение имени формы. Обработчик onClick кнопки использует this.form для обращения к текущей форме myForm.

<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
   onClick="this.form.text1.value=this.form.name">
</FORM>

Пример 2. Показана форма с несколькими элементами. Если пользователь щёлкает кнопку button2, функция showElements выводит диалог alert, содержащий имена всех элементов формы myForm.

function showElements(theForm) {
   str = "Form Elements of form " + theForm.name + ": \n "
   for (i = 0; i < theForm.length; i++) 
      str += theForm.elements[i].name + "\n"
   alert(str)
}
</script>
<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
   onClick="this.form.text1.value=this.form.name">
<INPUT NAME="button2" TYPE="button" VALUE="Show Form Elements"
   onClick="showElements(this.form)">
</FORM>

Диалог alert выведет следующий текст:

JavaScript Alert:
Form Elements of form myForm:
text1
button1
button2

Пример 3. Здесь используется ссылка объекта, а не ключевое слово this, для обращения к форме. Код возвращает ссылку на myForm, которая является формой, содержащей элемент myTextObject.

document.myForm.myTextObject.form

См. также

handleEvent

Вызывает обработчик для специфицированного события.

Синтаксис

handleEvent(event)

Параметр

event

name

Строка, специфицирующая имя данного объекта.

Безопасность

JavaScript 1.1. Это свойство разрушено по умолчанию. О разрушении данных см. книгу Клиентский JavaScript. Руководство.

Описание

Свойство name первоначально отражает значение атрибута NAME. Изменение свойства name переопределяет это значение. Свойство name не выводится на экран; оно используется для программного обращения к объекту.

Если несколько объектов на одной форме имеют одинаковые значения своих атрибутов NAME, автоматически создаётся массив с этим именем. Каждый элемент массива представляет отдельный объект Form. Элементы индексируются в порядке расположения в коде, начиная с 0. Например, если два элемента Text и элемент Textarea на одной форме имеют в своих атрибутах NAME значение "myField", создаётся массив из элементов myField[0], myField[1] и myField[2]. Вы должны знать о возможности возникновения такой ситуации в Вашем коде и знать, ссылается myField на единственный элемент или на массив элементов.

Пример

Здесь функция valueGetter использует цикл for для итерации по массиву элементов на форме valueTest. Окно msgWindow выводит имена всех элементов формы:

newWindow=window.open("http://home.netscape.com")

function valueGetter() {
   var msgWindow=window.open("")
   for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
      msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
   }
}

select

Выделяет область ввода текстового поля.

Синтаксис

select()

Параметры

Отсутствуют.

Описание

Используйте метод select для выделения области ввода текстового поля. Можно использовать метод select вместе с методом focus для выделения поля и позиционирования в нём курсора. Это даст пользователю возможность быстро заменить весь текст поля.

Пример

Обработчик onClick передаёт фокус текстовому полю и выделяет весь текст :

<FORM NAME="myForm">
<B>Last name: </B><INPUT TYPE="text" NAME="lastName" SIZE=20 VALUE="Pigman">
<BR><B>First name: </B><INPUT TYPE="text" NAME="firstName" SIZE=20 VALUE="Victoria">
<BR><BR>
<INPUT TYPE="button" VALUE="Change last name"
   onClick="this.form.lastName.select();this.form.lastName.focus();">
</FORM>

См. также

type

Для всех Text-объектов это поле будет иметь значение "text". Это свойство специфицирует тип элемента формы.

Пример

Записываются значения свойства type каждого элемента формы.

for (var i = 0; i < document.form1.elements.length; i++) {
   document.writeln("<BR>type is " + document.form1.elements[i].type)
}

value

Строка, отражающая значение атрибута VALUE объекта.

Безопасность

JavaScript 1.1. Это свойство разрушено по умолчанию. О разрушении данных см. книгу Клиентский JavaScript. Руководство.

Описание

Свойство value это строка. первоначально отражающая значение атрибута VALUE. Эта строка выводится в текстовом поле. Значение этого свойства изменяется, если пользователь или программа модифицируют это поле.

Вы можете установить свойство value в любое время. Вид Text-объекта обновляется сразу после установки свойства value.

Пример

Следующая функция вычисляет свойства value группы кнопок и отображает их в окне msgWindow:

function valueGetter() {
   var msgWindow=window.open("")
   msgWindow.document.write("submitButton.value is " +
      document.valueTest.submitButton.value + "<BR>")
   msgWindow.document.write("resetButton.value is " +
      document.valueTest.resetButton.value + "<BR>")
   msgWindow.document.write("myText.value is " +
      document.valueTest.myText.value + "<BR>")
   msgWindow.document.close()
}

Пример выведет:

submitButton.value is Query Submit
resetButton.value is Reset
myText.value is Stonefish are dangerous.

Предполагается, что кнопки определены так:

<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<INPUT TYPE="text" NAME="myText" VALUE="Stonefish are dangerous.">

См. также

Оглавление | Назад | Вперёд | Индекс

Дата последнего обновления: 28 мая 1999 года.
Copyright (c) 1999 Netscape Communications Corporation