Полезное:
Как сделать разговор полезным и приятным
Как сделать объемную звезду своими руками
Как сделать то, что делать не хочется?
Как сделать погремушку
Как сделать так чтобы женщины сами знакомились с вами
Как сделать идею коммерческой
Как сделать хорошую растяжку ног?
Как сделать наш разум здоровым?
Как сделать, чтобы люди обманывали меньше
Вопрос 4. Как сделать так, чтобы вас уважали и ценили?
Как сделать лучше себе и другим людям
Как сделать свидание интересным?
Категории:
АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника
Создание объектов Option
Объект класса 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
В данном примере при загрузке страницы с сервера у нас имеются три альтернативы. Их можно просматривать как ниспадающий список вариантов. После нажатия на кнопку " Удалить последний вариант " в форме остается только две альтернативы. Если еще раз нажать на эту кнопку, останется только одна альтернатива. В конечном счете, вариантов не останется вовсе, т.е. пользователь лишится возможности выбора. При нажатии кнопки сброса (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
Восстановление альтернатив мы поместили в обработчик события onReset контейнера FORM. Создаваемые объекты класса Option мы присваиваем объекту document.f.s класса Select. При этом первая альтернатива должна быть выбранной по умолчанию (аргументуdefaultSelected задано значение true), чтобы смоделировать поведение при начальной загрузке страницы.
Date: 2016-05-24; view: 305; Нарушение авторских прав; Помощь в написании работы --> СЮДА... |