В некотором смысле элемент с возможностью множественного выбора похож на набор флажков, а элемент без такой возможности - на набор радиокнопок. Однако варианты выбора, отображаемые элементом
Select
, не являются кнопками-переключателями: они определяются с помощью тега
<option>.
Элемент
Select
определяет свойство
options
, которое является объектом, подобным массиву, хранящим объекты
Option
.
Когда пользователь выбирает тот или иной вариант или отменяет выбор, элемент
Select
вызывает свой обработчик событий
onchange
.
Для элементов
Select
с возможностью выбора единственного варианта, доступное только для чтения свойство
selectedlndex
определяет выбранный в данный момент вариант. Для элементов
Select
с возможностью множественного выбора одного свойства
selectedlndex
недостаточно для представления полного набора выбранных вариантов. В этом случае для определения выбранных вариантов следует в цикле перебрать элементы массива
options[]
и проверить значения свойства
selected
каждого объекта
Option
.
Кроме свойства
selected
у каждого объекта
Option
есть свойство
text
, задающее строку текста, которая отображается в элементе
Select
для данного варианта. Используя это свойство, можно изменить видимый пользователем текст. Свойство
value
представляет доступную для чтения и записи строку текста, который отсылается на веб-сервер при передаче данных формы. Даже если вы пишете исключительно клиентскую программу и ваши формы никуда не отправляются, свойство
value
(или соответствующий ей HTML-атрибут
value
) можно использовать для хранения данных, которые потребуются после выбора пользователем определенного варианта. Обратите внимание, что элемент
Option
не определяет связанных с формой обработчиков событий; используйте вместо этого обработчик
onchange
соответствующего элемента
Select
.
Помимо задания свойства
text
объектов
Option
имеются способы динамического изменения выводимых в элементе
Select
вариантов с помощью особых возможностей свойства
options
, которые ведут свое существование с самого начала появления поддержки клиентских сценариев. Можно обрезать массив элементов
Option
, установив свойство
options.length
равным требуемому количеству вариантов, или удалить все объекты
Option
, установив значение свойства
options.length
равным нулю. Можно удалять отдельные объекты
Option
из элемента
Select
, присваивая элементам массива
options[]
значение null. В этом случае удаляются соответствующие объекты
Option
, а все элементы, расположенные в массиве
options[]
правее, автоматически сдвигаются влево, заполняя опустевшее место.
Чтобы добавить в элемент
Select
новый вариант, можно создать его с помощью конструктора
Option
и добавить в конец массива
options[],
как показано ниже:
// Создать новый объект Option
var zaire = new Option("Zaire", // Свойство text
"zaire", // Свойство value
false, //
Свойство defaultSelected
false); // Свойство selected
// Отобразить вариант в элементе Select, добавив его в конец массива
Эта глава начиналась с утверждения, что она является одной из наиболее важных в книге. Она также по необходимости оказалась одной из наиболее длинных. Этот раздел завершает главу описанием некоторых особенностей объекта
Document
.
15.10.1. Свойства объекта Document
В этой главе уже были представлены некоторые свойства объекта
Document
, такие как
body, documentElement
и
forms
, ссылающиеся на специальные элементы документа. Кроме них документы определяют еще несколько свойств, представляющих интерес:
cookie
Специальное свойство, позволяющее JavaScript-программам читать и писать cookie-файлы. Это свойство рассматривается в главе 20.
domain
Свойство, которое позволяет доверяющим друг другу веб-серверам, принадлежащим одному домену, ослаблять ограничения, связанные с политикой общего происхождения, на взаимодействие между их веб-страницами (подробности см. в разделе 13.6.2.1).
lastModified
Строка, содержащая дату последнего изменения документа.
location
Это свойство ссылается на тот же объект
Location
, что и свойство
location
объекта
Window
.
referrer
URL-адрес документа, содержащего ссылку (если таковая существует), которая привела броузер к текущему документу. Это свойство имеет то же значение, что и HTTP-заголовок Referer, но записывается с двумя буквами r.
title
Текст между тегами
<title>
и
</title>
данного документа.
URL
Свойство
URL
документа является строкой, доступной только для чтения, а не объектом
Location
. Значение этого свойства совпадает с начальным значением свойства
location.href
, но, в отличие от объекта
Location
, не является динамическим. Если пользователь выполнит переход, указав новый идентификатор фрагмента внутри документа, то свойство