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

Checkbox

Переключатель на форме HTML. Переключатель это бокс выбора, дающий пользователю возможность включать и выключать опцию.

Клиентский объект

Реализован в

JavaScript 1.0

JavaScript 1.1: добавлено свойство type; добавлены обработчики событий onBlur и onFocus; добавлены методы blur и focus.

JavaScript 1.2: добавлен метод handleEvent.

Создание

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

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

Описание

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

Объект Checkbox это элемент формы и он обязан быть определён (теперь вроде уже нет - прим перев.) внутри тэга FORM.

Используйте свойство checked для специфицирования статуса переключателя (включён он или нет). Свойство defaultChecked используется для специфицирования статуса переключателя при загрузке или очистке формы.

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

Свойство	Описание
`checked`	Булево свойство, отражающее текущее состояние переключателя (есть ли "птичка").
`defaultChecked`	Булево свойство, отражающее атрибут `CHECKED`.
`form`	Специфицирует форму, содержащую объект `Checkbox`.
`name`	Отражает атрибут `NAME`.
`type`	Отражает атрибут `TYPE`.
`value`	Отражает атрибут `TYPE`.

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

Метод	Описание
`blur`	Убирает фокус.
`click`	Симулирует щелчок мыши.
`focus`	Передаёт фокус ввода.
`handleEvent`	Вызывает обработчик специфицированного события.

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

Примеры

Пример 1.

Выводится группа из 4 переключателей, которые все по умолчанию отмечены:

<B>Specify your music preferences (check all that apply):</B>

<BR><INPUT TYPE="checkbox" NAME="musicpref_rnb" CHECKED> R&B

<BR><INPUT TYPE="checkbox" NAME="musicpref_jazz" CHECKED> Jazz

<BR><INPUT TYPE="checkbox" NAME="musicpref_blues" CHECKED> Blues

<BR><INPUT TYPE="checkbox" NAME="musicpref_newage" CHECKED> New Age

Пример 2.

Форма из 3 текстовых полей и одного переключателя. Можно использовать checkbox для конвертирования текста текстовых полей в верхний регистр. Каждое текстовое поле имеет обработчик onChange, который конвертирует значение поля в верхний регистр, если checkbox помечен. Переключатель имеет обработчик onClick, который конвертирует все поля в верхний регистр, если пользователь отметит переключатель.

<HTML>
<HEAD>
<TITLE>Checkbox object example</TITLE>

</HEAD>
<SCRIPT>
function convertField(field) {
   if
(document.form1.convertUpper.checked) {
      field.value =
field.value.toUpperCase()}
}
function convertAllFields() {

   document.form1.lastName.value = document.form1.lastName.value.toUpperCase()

   document.form1.firstName.value = document.form1.firstName.value.toUpperCase()

   document.form1.cityName.value = document.form1.cityName.value.toUpperCase()
}

</SCRIPT>

<BODY>
<FORM NAME="form1">

<B>Last name:</B>
<INPUT TYPE="text" NAME="lastName"
SIZE=20 onChange="convertField(this)">
<BR><B>First name:</B>

<INPUT TYPE="text" NAME="firstName" SIZE=20 onChange="convertField(this)">

<BR><B>City:</B>
<INPUT TYPE="text" NAME="cityName" SIZE=20
onChange="convertField(this)">
<P><INPUT TYPE="checkBox" NAME="convertUpper"

   onClick="if (this.checked) {convertAllFields()}"

   > Convert fields to upper case
</FORM>
</BODY>
</HTML>

См. также

Form, Radio

blur

Убирает фокус.

Метод из	`Checkbox`
Реализован в	JavaScript 1.0

Синтаксис

blur()

Параметры

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

См. также

Checkbox.focus

checked

Булево значение, специфицирующее статус бокса.

Свойство из	`Checkbox`
Реализовано в	JavaScript 1.0

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

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

Описание

Если переключатель выбран (отмечен "птичкой"), значение его свойства checked будет true; иначе - false.

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

См. также

Checkbox.defaultChecked

click

Симулирует щелчок мыши, но не переключает на обработчик onClick. Метод выделяет бокс и переключает его значение.

Метод из	`Checkbox`
Реализован в	JavaScript 1.0

Синтаксис

click()

Параметры

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

Примеры

Изменяется статус переключателя newAge формы musicForm:

document.musicForm.newAge.click()

defaultChecked

Булево значение, указывающее статус по умолчанию переключателя.

Свойство из	`Checkbox`
Реализовано в	JavaScript 1.0

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

Описание

Если переключатель отмечен по умолчанию, значение свойства defaultChecked - true; иначе - false.
defaultChecked первоначально отражает использование атрибута CHECKED в тэге INPUT; однако установка defaultChecked переопределяет значение атрибута CHECKED.

Вы можете установить свойство defaultChecked в любой момент. Вид переключателя не изменяется после установки свойства defaultChecked, это происходит только при установке свойства checked.

См. также

Checkbox.checked

focus

Передаёт переключателю фокус.

Метод из	`Checkbox`
Реализован в	JavaScript 1.0

Синтаксис

focus()

Параметры

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

Описание

Метод focus используется для перехода к переключателю и передаче ему фокуса. Тогда пользователь сможет изменять статус переключателя.

См. также

Checkbox.blur

form

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

Свойство из	`Checkbox`
Только для чтения
Реализовано в	JavaScript 1.0

Описание

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

См. также

Form

handleEvent

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

Метод из	`Checkbox`
Реализован в	JavaScript 1.2

Синтаксис

handleEvent(event)

Параметры

event

Имя события, для которого специфицированный объект имеет обработчик события.

name

Строка - имя переключателя.

Свойство из	`Checkbox`
Реализовано в	JavaScript 1.0

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

Описание

Если несколько объектов формы имеют одно значение атрибута NAME, автоматически создаётся массив с данным именем. Каждый элемент этого массива представляет отдельный Form -объект. Элементы индексируются в порядке их появления в коде, начиная с 0. Например, если два элемента Text и элемент Button в одной форме имеют атрибут 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>")
   }
}

type

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

Свойство из	`Checkbox`
Только для чтения
Реализовано в	JavaScript 1.1

Примеры

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

for (var i = 0; i < document.form1.elements.length; i++) {

   document.writeln("<BR>type is " + document.form1.elements[i].type)
}

value

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

Свойство из	`Checkbox`
Реализовано в	JavaScript 1.0

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

См. также

Checkbox.checked, Checkbox.defaultChecked

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

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