3.2 Организация списков
Элемент <select> предназначен для организации меню, различных списков и выбора из них. Пункты списка создаются элементами <option>. При отправке данных на сервер пересылается имя списка вместе со значением, которое по умолчанию является выбранной строкой. Передаваемое значение может быть изменено. Ниже представлен пример использования элемента <option> с различными атрибутами. Результат показан на рис. 3.2.
|
Пример 3.2. Списки выбора |
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>Элемент <option></TITLE> </HEAD> <BODY> <SELЕСT name="select1"> <ОРТION>Москва <OPTION selected>Жмеринка <OPTION>Большие Васюки </SELECT> <SELЕСТ name="select2" size=5 multiple> <OPTION selected>Полыхаев <OPTIОN value="бухгалтер">Берлага <OРТION label="васис" selected>Васисуалий Андреевич Лоханкин <OPTION style="color: red;">Гигиенишвили <OPTION>Пряхин <OPTION>Дуня <OPТION>Люция Францевна Пферд </SELЕCT> </BODY> </HTML>
|
3.3 Связывание элементов формы
Элементы для связывания различных форм весьма полезны в случае автоматической обработки содержимого страницы и при использовании альтернативных браузеров. Они позволяют задать логическую связь между различными элементами. Например, связать надпись на экране с каким-то элементом формы, таким как ее название. Для связывания текстовой информации и элемента управления, т.е. организации подписи, используют элемент <LABEL>. Каждый конкретный элемент <LABEL> может связываться только с одним элементом формы, но с одним элементом формы может быть связано несколько элементов <label>.
В некоторых случаях необходимо организовать подпись не к одному, а к ряду элементов и организовать их в группу. Для организации подписи ко многим элементам служат элементы <fieldset> и <legend>.
Применение элементов <LABEL>, <fieldset>, <legend> показано в примере 3.3 и на рис.3.3.
|
Пример 3.3. Связывание элементов формы |
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>Элемент <fieldset></TITLE> </HEAD> <BODY> <FIELDSЕТ> <LEGEND style="font-family:'arial';">анкета</lеgend> <FORM action="uri" method="post"> <LABЕL for="имя">имя:</label> <INPUT type="text" id="имя"><br><br> пол<br> <LАВЕL for="пол">м</LABEL><INPUT type="radio" name="пол" value="м"> <LABEL for="пол">ж</LABEL><INPUT type="rаdio" name="пол" value="ж"> </FОRM> </FIЕLDSET> </ВОDY> </HTML>
|