На главную страницу
Форум txt.version   




Статья :: Option
Оглавление | Назад | Вперёд | Индекс

Option

Опция в списке выбора.

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

Реализован в

JavaScript 1.0

JavaScript 1.1: добавлено свойство defaultSelected; в свойство text добавлена возможность изменять текст опции.

Создание

Конструктор Option или тэг HTML OPTION.

Создание объекта Option конструктором:

new Option([text[, value[, defaultSelected[, selected]]]])

После создания Option-объекта вы можете добавлять его в список выбора, используя массив Select.options.

Параметры

text

Текст, отображаемый в списке выбора.

value

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

defaultSelected

Специфицирует, выбрана ли опция по умолчанию (true или false).

selected

Специфицирует текущий статус выбора опции (true или false).

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

Свойство Описание
defaultSelected

Специфицирует статус по умолчанию опции.

index

Индекс с базой 0 элемента в массиве Select.options.

length

Количество элементов в массиве Select.options.

selected

Специфицирует текущий статус опции (выбрана или нет).

text

Специфицирует текст опции.

value

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

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

Этот объект наследует методы watch и unwatch из объекта Object.

Описание

Обычно Вы работаете с объектами Option в контексте списка выбора/selection list (объект Select). Когда JavaScript создаёт Select-объект для каждого тэга SELECT в документе, он создаёт Option-объекты для тэгов OPTION внутри тэга SELECT и помещает эти объекты в массив options объекта Select.

Кроме того, Вы можете создавать новые опции, используя конструктор Option, и добавлять эти опции в список выбора. После создания опции и добавления её в Select-объект, Вы обязаны обновить документ, используя history.go(0). Этот оператор обязан быть последним. При перезагрузке документа переменные теряются, если они не сохранены в куках или значениях элементов формы.

Вы можете использовать свойства Option.selected и Select.selectedIndex для изменения статуса выбора опции.

  • Свойство Select.selectedIndex это целое число, специфицирующее индекс выбранной опции. Оно чаще всего используется в Select-объектах, которые созданы без атрибута MULTIPLE. Следующий оператор устанавливает свойство selectedIndex  объекта Select:
  • document.myForm.musicTypes.selectedIndex = i

  • Свойство Option.selected это Булево значение, специфицирующее текущий статус выбора опции Select-объекта. Если опция выбрана, её свойство selected имеет значение true; иначе - false. Это чаще всего используется в Select-объектах, созданных с атрибутом MULTIPLE. Следующий оператор устанавливает свойство selected опции в true:
  • document.myForm.musicTypes.options[i].selected = true

Для изменения текста опции используйте свойство Option.text. Например, форма имеет следующий Select-объект:

<SELECT name="userChoice">
   <OPTION>Choice 1
   <OPTION>Choice 2
   <OPTION>Choice 3
</SELECT>

Вы можете установить текст элемента iй на основе текста, введённого в текстовое поле whatsNew:

myform.userChoice.options[i].text = myform.whatsNew.value

Вам не нужно перезагружать или обновлять документ после изменения текста опции.

Пример

Создаётся два Select-объекта, один с и другой без атрибута MULTIPLE. Никакие опции этих объектов первоначально не определены. Когда пользователь щёлкает кнопку, ассоциированную с Select-объектом, функция populate создаёт 4 опции для Select-объекта и выбирает первую опцию.

<SCRIPT>
function populate(inForm) {
   colorArray = new Array("Red", "Blue", "Yellow", "Green")
   var option0 = new Option("Red", "color_red")
   var option1 = new Option("Blue", "color_blue")
   var option2 = new Option("Yellow", "color_yellow")
   var option3 = new Option("Green", "color_green")
   for (var i=0; i < 4; i++) {
      eval("inForm.selectTest.options[i]=option" + i)
      if (i==0) {
         inForm.selectTest.options[i].selected=true
      }
   }
   history.go(0)
}
</SCRIPT>
<H3>Select Option() constructor</H3>
<FORM>
<SELECT NAME="selectTest"></SELECT><P>
<INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)">
<P>
</FORM>
<HR>
<H3>Select-Multiple Option() constructor</H3>
<FORM>
<SELECT NAME="selectTest" multiple></SELECT><P>
<INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)">
</FORM>

defaultSelected


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

Свойство из

Option

Реализовано в

JavaScript 1.1

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

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

Описание

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

Вы можете установить свойство defaultSelected в любое время. Отображение соответствующего Select-объекта не обновляется, когда Вы устанавливаете свойство defaultSelected опции, оно обновляется только при установке свойств Option.selected или Select.selectedIndex.

Объект Select, созданный без атрибута MULTIPLE, может иметь выбранной по умолчанию только одну опцию. Если Вы устанавливаете defaultSelected в таком объекте, любые предыдущие установки по умолчанию, включая установки атрибутом SELECTED, очищаются. Если Вы устанавливаете defaultSelected в Select-объекте, созданном с атрибутом MULTIPLE, предыдущие установки выбора не изменяются.

Пример

Здесь функция restoreDefault возвращает объект musicType Select в состояние по умолчанию. Цикл for использует массив options для вычисления каждой опции Select-объекта. Оператор if устанавливает свойство selected, если defaultSelected имеет значение true.

function restoreDefault() {
   for (var i = 0; i < document.musicForm.musicType.length; i++) {
      if (document.musicForm.musicType.options[i].defaultSelected == true) {
         document.musicForm.musicType.options[i].selected=true
      }
   }
}

В предыдущем примере предполагается, что Select-объект определён примерно так:

<SELECT NAME="musicType"> 
   <OPTION SELECTED> R&B
   <OPTION> Jazz
   <OPTION> Blues
   <OPTION> New Age
</SELECT>

См. также

Option.selected, Select.selectedIndex

index


Индекс с базой 0 элемента в массиве Select.options.

Свойство из

Option

Реализовано в

JavaScript 1.0

Описание

Свойство index специфицирует позицию элемента в массиве Select.options, начиная с 0.

Пример

Здесь функция getChoice возвращает значение свойства index выбранной опции. Цикл for вычисляет каждую опцию Select-объекта musicType. Оператор if находит выбранную опцию.

function getChoice() {
   for (var i = 0; i < document.musicForm.musicType.length; i++) {
      if (document.musicForm.musicType.options[i].selected == true) {
         return document.musicForm.musicType.options[i].index
      }
   }
   return null
}

Предполагается, что Select-объект таков:

<SELECT NAME="musicType">
   <OPTION SELECTED> R&B
   <OPTION> Jazz
   <OPTION> Blues
   <OPTION> New Age
</SELECT>

Обратите внимание, что можно также определить индекс выбранной опции этого примера путём использования document.musicForm.musicType.selectedIndex.

length


Количество элементов в массиве Select.options.

Свойство из

Option

Только для чтения

Реализовано в

JavaScript 1.0

Описание

Значение этого свойства такое же, что и значение Select.length.

Примеры

См. в Option.index пример для свойства length.

selected


Булево значение, указывающее на то, выбрана ли опция Select-объекта.

Свойство из

Option

Реализовано в

JavaScript 1.0

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

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

Описание

Если опция Select-объекта выбрана, значение свойства selected опции равно true; иначе - false. Вы можете установить свойство selected в любое время. Вид ассоциированного Select-объекта обновляется сразу после установки свойства selected для одной из его опций.

Вообще, свойство Option.selected используется чаще, чем свойство Select.selectedIndex, в Select-объектах, созданных с атрибутом MULTIPLE. С помощью свойства Option.selected Вы можете вычислять каждую опцию массива Select.options для определения множественного выбора, а также можете выбирать отдельные опции без изменения статуса выбора других опций.

Примеры

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

См. также

Option.defaultSelected, Select.selectedIndex

text


Строка, специфицирующая текст опции в списке выбора.

Свойство из

Option

Реализовано в

JavaScript 1.0

JavaScript 1.1: свойство text может быть изменено для обновления опции выбора. В предыдущих релизах Вы могли установить свойство text, но новое значение не отражалось в Select-объекте.

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

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

Описание

Свойство text первоначально содержит текст, который идёт после тэга OPTION в тэге SELECT. Вы можете установить свойство text в любое время, и текст, отображаемый опцией в списке выбора, изменится.

Примеры

Пример 1. Здесь функция getChoice возвращает значение свойства text для выбраной опции. Цикл for вычисляет каждую опцию Select-объекта musicType. Оператор if находит выбранную опцию.

function getChoice() {
   for (var i = 0; i < document.musicForm.musicType.length; i++) {
      if (document.musicForm.musicType.options[i].selected == true) {
         return document.musicForm.musicType.options[i].text
      }
   }
   return null
}

Предполагается, что Select-объект таков:

<SELECT NAME="musicType">
   <OPTION SELECTED> R&B
   <OPTION> Jazz
   <OPTION> Blues
   <OPTION> New Age
</SELECT>

Пример 2. В следующей форме пользователь может ввести некоторый текст в первом текстовом поле, а затем ввести число от 0 до 2 (включительно) во втором текстовом поле. Когда пользователь щёлкает по кнопке, текст изменяется на номер выбранной опции, и эта опция выбирается.

Код выглядит так:

<SCRIPT>
function updateList(theForm, i) {
   theForm.userChoice.options[i].text = theForm.whatsNew.value
   theForm.userChoice.options[i].selected = true
}
</SCRIPT>
<FORM>
<SELECT name="userChoice">
   <OPTION>Choice 1
   <OPTION>Choice 2
   <OPTION>Choice 3
</SELECT>
<BR>
New text for the option: <INPUT TYPE="text" NAME="whatsNew">
<BR>
Option to change (0, 1, or 2): <INPUT TYPE="text" NAME="idx">
<BR>
<INPUT TYPE="button" VALUE="Change Selection"
onClick="updateList(this.form, this.form.idx.value)">
</FORM>

value


Строка, отражающая атрибут VALUE опции.

Свойство из

Option

Только для чтения

Реализовано в

JavaScript 1.0

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

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

Описание

Если атрибут VALUE специфицируется в HTML, то свойство value это строка, отражающая его. Если атрибут VALUE не специфицируется в HTML, то свойство value это пустая строка. Свойство value не отображается на экране, а возвращается на сервер, если опция выбрана.

Не путайте это свойство со статусом выбора опции или текста, который отображается вслед за ней. Свойство selected определяет статус выбора объекта, а свойство defaultSelected определяет статус выбора по умолчанию. Отображаемый текст специфицируется после тэга OPTION и соответствует свойству text.

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

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

Option

страницы в данном разделе 
 ancor  applet
 area.htm  array
 Индекс  Boolean
 button  Checkbox
 Классы, Конструкторы и Методы Java  Значения Цветов
 Оглавление  Куки Netscape
 date.htm  document
 event  FileUpload
 form.htm  Frame
 Function  Обработчики Событий
 Hidden  History
 Image  Оглавление
 java.htm  JavaArray
 JavaClass  JavaObject
 JavaPackage  Приложение A. Зарезервированные Слова
 Layer  JSException
 JSObject  Plugin
 link.htm  Location
 math.htm  MimeType
 navigator  netscape
 Number  Object
 Объекты, Методы и Свойства  Операции
 Option  Packages
 Приложения  Справочник по Классам LiveConnect
 Элементы Языка  Объекты. Справочник.
 Password  Plugin
 Об Этой Книге  Radio
 RegExp  Reset
 screen  Select
 Операторы  String
 Style  Submit
 sun.htm  text.htm
 Textarea  toc.htm
 Свойства и Функции Верхнего Уровня  Новые Возможности в Этой Версии
 window   


Разделы
Околокомпьютерная литература (375)
Программирование (102)
Программы (75)
ОС и Сети (49)
Интернет (29)
Аппаратное обеспечение (16)
Базы данных (6)

Содержание сайта (выборка)
Apache
Протоколы TCP/IP (принципы, протоколы и архитектура)

PHP, PELR, JSP
PHP
JavaServer Pages (JSP)

Базы данных
Основы mysql
СУБД INFORMIX
СУБД POSTGRES
Основы проектирования реляционных баз данных

HTML, javascript
Спецификация HTML 4.01
Каскадные Таблицы Стилей, Уровень 2
Клиентский JavaScript. Справочник.
JavaScript руководство пользователя
Серверный JavaScript 1.4. Руководство по Использованию.

Паскаль, C, C++, C#
GCC (примеры)
FAQ Валентинa Озеровa DELPHI
C





 
©  programming-lang.com  справочник программиста