Home | О проекте | Новости | Рекламные статейки

ВернутьсяВ начало

1.Рекламка: s |

OPTION NN 2   IE 3   DOM 1
2.Рекламка: s | ;
x |   

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

Сценарий имеет следующие возможности:

  • Удаление отдельной опции (приводящее к сжатию списка). - следует установить соответствующий элемент массива в значение null. (selectObj.options[2] = null). При этом длина массива уменьшится на 1.
  • Изменение элементов списка в меньшую (большую) сторону. - нужно установить свойство length массива на другую величину, а затем установить свойства всех опций к новым значениям. (
    selectObj.length = 3;
    selectObj.options[0].text = "...";
    selectObj.options[1].text = "...";
    selectObj.options[2].text = "...";

    selectObj.options[0].value = "...";
    selectObj.options[1].value = "...";
    selectObj.options[2].value = "...";
    )
  • Удаление всех опций - необходимо обнулить длину массива (selectObj.length = 0;)
  • Добавление новых опций к объекту. - необходимо использовать конструктор new Option().
    Пример: selectObj.options[4] = new Option("Option5","http://www.anktrue.spb.ru",true,false)
  • В IE4 возможен и другой способ изменения опций. Он состоит в использовании двух методов массива options: remove() и add()
    var newOpt = document.createElement("OPTION");
    selectObj.options.add(newOpt, 3);
    ...
    selectObj.options.remove(7);
  • В NN6, поддерживающем стандарт W3C DOM 2, возможен ещё один подход к изменению опций. Здесь можно воспользоваться методами add() и remove() объекта SELECT. Они похожи на методы объекта options в IE, но принадлежат непосредственно объекту SELECT и в в методе add() в качестве второго аргумента используют не индекс, а ссылку на объект OPTION, перед которым нужно вставить новый элемент:
    var newOpt = document.createElement("OPTION");
    selectObj.remove(3);

    selectObj.add(newOpt, selectObj.options[3]);

Общие свойства, методы и обработчики событий перечислены в разделе "Все злементы HTML"

 
Эквивалент HTML

<OPTION>

 
Создание объекта:

optionName = new Option ([optionText, optionValue, defaultSelected, selected ])
или:
selectName.options [index] =optionName
где:

  • optionName — является или именем нового объекта или свойством существующего объекта.
  • optionText — определяет текст, который будет отображен в списке select. вы можете обращаться к этому значению, используя Свойство text.
  • optionValue — определяет значение, которое будет возвращено серверу, когда опция выбрана, и форма подчинена. вы можете обращаться к этому значению, используя Свойство value.
  • defaultSelected — определяет, выбрана ли опция первоначально (истина или ложь). вы можете обращаться к этому значению, используя Свойство defaultSelected.
  • selected — определяет текущее состояние опции select (истина или ложь). вы можете обращаться к этому значению, используя Свойство selected.
  • selectName — имя существующего объекта Select.
  • index — целое число, представляющее опцию в объекте Select. вы можете обращаться к этому значению, используя Свойство index

Общие свойства, методы и обработчики событий перечислены в разделе "Все злементы HTML"

 
Объектно-ориентированная модель
NN [window.]document.formName.selectName.options[i]
[window.]document.forms[i].elements[i].options[i]
IE [window.]document.formName.selectName.options[i]
[window.]document.forms[i].elements[i].options[i]
[window.]document.all.elementID
NN 6/IE5+ [window.]document.getElementById("elementID")

Свойства:


defaultSelected NN 2   IE 3   DOM 1
 Чтение/Изменение
 

Имеет ли элемент атрибут SELECTED в теге изначально. Вы можете сравнивать текущее свойство selected с defaultSelected, чтобы видеть, изменилось ли состояние элемента select с загрузки документа. Изменение этого свойства не затрагивает текущее состояние selected.

 
Пример:

var listItem = document.forms[0].selector.options[2] if (listItem.selected != listItem.defaultSelected) { process for changed state }

 
Возвращаемое значение:
Булево значение: true | false.
 
Значение по умолчанию: Устанавливается атрибутом тэга.

form NN 2   IE 3   DOM n/a
  Только чтение
 

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

 
 
 
Возвращаемое значение:
Ссылка на объект.
 
Значение по умолчанию: Ничего.

index NN 2   IE 3   DOM n/a
  Только чтение
 

Возвращает отсчитываемое от нуля индексное значение текущего объекта option в пределах коллекции options элемента SELECT. Свойство selectedIndex объекта SELECT возвращает индексное значение опции, которая в настоящее время выбрана.

 
Пример:

var firstValue = document.forms[0].stateList.options[0].index

 
Возвращаемое значение:
Целое число.
 
Значение по умолчанию: Ничего.

label NN 6  IE (только 5)
  Чтение/запись
 

Данное свойство соответствует атрибуту label элемента option (HTML 4.0). Этот атрибут позволяет присвоить опции новый текст

 
 
 
Возвращаемое значение:
Строка
 
Значение по умолчанию: Ничего.

selected NN 2   IE 3   DOM 1
 Чтение/Изменение
 

Была ли опция списка выбрана пользователем, означая, что ее значение отправлено с формой. Сценарии могут изменять значение, чтобы выбирать пункт алгоритмически. Чтобы выяснять, какая опция выбрана, более эффективно использовать свойство selectedIndex объекта select, чем выполнение цикла перебора всех опций в поиске тех, чьи выбранные свойства = true. Исключение этого - когда элемент SELECT установлен, чтобы позволять множественные выборы, Вы должны циклически пройти их все, чтобы найти выбранные.

 
Пример:

document.forms[0].selectList.options[3].selected = true

 
Возвращаемое значение:
Булево значение: true | false.
 
Значение по умолчанию: false

text NN 2   IE 3   DOM 1
 Чтение/Изменение
 

Текст, связанный с элементом OPTION. Это - текст между начальным и конечным тэгами, а также то, что появляется в элементе SELECT на экране. Скрытое значение, связанное с пунктом списка может быть сохранено, восстановлено и изменено через свойство value.

 
Пример:

var list = document.forms[0].selectList var listItemText = list.options[list.selectedIndex].text

 
Возвращаемое значение: Строка.
 
Значение по умолчанию: Ничего.

value NN 4   IE 4   DOM 1
 Чтение/Изменение
 

Значение, связанное с элементом OPTION. Если элемент OPTION имеет атрибут VALUE или уже установленное свойство value, это - значение свойства value; иначе будет возвращен текст, видимый в списке.

 
Пример:

var itemValue = document.forms[0].selectList.options[2]value

 
Возвращаемое значение: Строка.
 
Значение по умолчанию: Ничего.

footer:
Rambler's Top100