русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

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


Дата добавления: 2013-12-23; просмотров: 443; Нарушение авторских прав


Объект класса Option интересен тем, что в отличие от многих других встроенных в DOM объектов JavaScript, имеет конструктор. Это означает, что программист может сам создать объект класса Option:

opt = new Option([ text, [ value, [ defaultSelected, [ selected ]]]]);

где аргументы соответствуют свойствам обычных объектов класса Option:

  • text - строка текста, которая размещается в контейнере <OPTION>(например: <OPTION> текст </OPTION> );
  • value - значение, которое передается серверу при выборе альтернативы, связанной с объектом Option ;
  • defaultSelected - выбрана ли эта альтернатива по умолчанию ( true /false );
  • selected - альтернатива была выбрана пользователем ( true / false ).

На первый взгляд не очень понятно, для чего может понадобиться программисту такой объект, ведь создать объект класса Select нельзя и, следовательно, нельзя приписать ему новый объект Option. Все объясняется, когда речь заходит об изменении списка альтернатив у имеющегося в документе объекта Select. Делать это можно, при этом изменение списка альтернатив Select не приводит к переформатированию документа. Изменение списка альтернатив позволяет решить проблему создания вложенных меню, которых нет в HTML-формах, путем программирования обычных меню ( options[] ).

При программировании альтернатив следует обратить внимание на то, что у объектов класса Option нет свойства name, в виду того, что у контейнера<OPTION> нет атрибута NAME. Таким образом, к встроенным в документ объектам класса Option можно обращаться только как к элементам коллекции options[].

Коллекция options[]

Встроенный массив ( коллекция ) options[] - это одно из свойств объектаSelect. Элементы этого массива являются полноценными объектами классаOption. Они создаются по мере загрузки страницы браузером. Количество объектов Option, содержащихся в объекте document.f.s класса Select, можно узнать с помощью стандартного свойства массива:document.f.s.options.length. Кроме того, у самого объекта Select есть такое же свойство: document.f.s.length - оно полностью идентично предыдущему.



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

<FORM><SELECT NAME=s><OPTION>Первый вариант</OPTION><OPTION>Второй вариант</OPTION><OPTION>Третий вариант</OPTION></SELECT><INPUT TYPE=button VALUE="Удалить последний вариант" onClick="form.s.options[form.s.length-1]=null;"><INPUT TYPE=reset VALUE="Сбросить"></FORM>

Пример 5.3. Удаление вариантов из SELECT (html, txt)

В данном примере при загрузке страницы с сервера у нас имеются три альтернативы. Их можно просматривать как ниспадающий список вариантов. После нажатия на кнопку " Удалить последний вариант " в форме остается только две альтернативы. Если еще раз нажать на эту кнопку, останется только одна альтернатива. В конечном счете, вариантов не останется вовсе, т.е. пользователь лишится возможности выбора. При нажатии кнопки сброса ( reset) варианты не восстанавливаются - альтернативы утеряны бесследно.

Теперь, используя конструктор Option, сделаем процесс обратимым:

<SCRIPT>function RestoreOptions(){document.f.s.options[0] = new Option('Вариант один','',true,true);document.f.s.options[1] = new Option('Вариант два');document.f.s.options[2] = new Option('Вариант три');return false;}</SCRIPT><FORM NAME=f onReset="RestoreOptions();"><SELECT NAME=s><OPTION>Первый вариант</OPTION><OPTION>Второй вариант</OPTION><OPTION>Третий вариант</OPTION></SELECT><INPUT TYPE=button VALUE="Удалить последний вариант" onClick="form.s.options[form.s.length-1]=null;"><INPUT TYPE=reset VALUE=Reset></FORM>

Пример 5.4. Удаление и добавление вариантов из SELECT (html, txt)

Восстановление альтернатив мы поместили в обработчик события onResetконтейнера FORM. Создаваемые объекты класса Option мы подчиняем объектуdocument.f.s класса Select. При этом первая альтернатива должна быть выбранной по умолчанию (аргументу defaultSelected задано значение true ), чтобы смоделировать поведение при начальной загрузке страницы.



<== предыдущая лекция | следующая лекция ==>
Поля формы и их объекты | Обработчик события onChange объекта Select


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Полезен материал? Поделись:

Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.008 сек.