Per koci ru ad astra!

Курс HTML :: Формы: элементы выбора (select). Урок 16.

Настройка сайта

Проверка javascript.

Светофор, свет красный

В текущей ситуации, на вашем компьютере, данном браузере, при данной конфигурации вы не можете использовать программы, написанные на javascript.

Вероятные причины проблемы: в настройках браузера отключена возможность выполнения javascript и/или в данный момент имеются проблемы подключения к Интернету.

Решение проблемы: устраните причины, указанные выше и нажмите CTRL-F5 для перезагрузки софта и контента этой странички.

Должно помочь.


Рекомендую курсы
Рекомендаций не видно по причине отключенного javascript.


Домен inumo.ru


Урок 16. Формы: элементы выбора (select).
HTML - основа основ Интернета. Базовый курс. Формы: элементы выбора (select). Урок 16. Элементы выбора в форме задаются парным тегом <select></select>. Каждый элемент для выбора заключается в теги <option></option>. Атрибут name должен быть у тега <select>. Этот атрибут определяет имя переменной, которое будет передано обработчику. Атрибут checked определяет, какой <option> изначально выбран. Атрибут size тега <select> определяет, сколько элементов <option> следует одновременно показывать пользователю. Если атрибута size нет, будет показан 1 элемент. Атрибут multiple тега <select> определяет, что возможен выбор нескольких элементов <option> одновременно. Выбор осуществляется выделением отдельных элементов при нажатии CTRL-левая кнопка мыши, или группы элементов при нажатии SHIFT-левая кнопка мыши.
© Перепечатка разрешается с установкой ссылки на ресурс http://koci.inumo.ru
16. Формы: элементы выбора (select).
Элементы выбора в форме задаются парным тегом <select></select>. Во многом элементы выбора похожи на списки, которые мы изучили выше.

Основное отличие от списков заключается в том, что пользователю дается возможность выбора значения, которое далее, после отправки формы, будет передано обработчику.

Каждый элемент для выбора заключается в теги <option></option>.

Особенности данного функционала следующие:
  1. type отсутствует - атрибут type у тега <select> отсутствует. Тег <select> сам по себе определяет, что это выбор из нескольких элементов.
  2. name="sleep" - атрибут name должен быть у тега <select>. Этот атрибут определяет имя переменной, которое будет передано обработчику.
  3. checked="checked" - атрибут checked определяет, какой <option> изначально выбран.
  4. value="9" - атрибут value в данном случае необязателен, его можно использовать для тега <option>. Тонкость здесь такая: если атрибут value используется и выбран данный <option>, то переменной name тега <select> будет присвоено значение атрибута value. А если атрибута value нет и выбран данный <option>, то переменной name тега <select> будет присвоено значение, которое расположено <option>между тегами</option>.
  5. size="5" - атрибут size тега <select> определяет, сколько элементов <option> следует одновременно показывать пользователю. Если атрибута size нет, будет показан 1 элемент.
  6. multiple="multiple" - атрибут multiple тега <select> определяет, что возможен выбор нескольких элементов <option> одновременно. Выбор осуществляется выделением отдельных элементов при нажатии CTRL-левая кнопка мыши, или группы элементов при нажатии SHIFT-левая кнопка мыши.
Напишем теперь коды для установки на тестовую страничку:
<p>Сколько часов в день Вы спите?</p>
<p>
<select name="sleep" size="5" multiple="multiple">
<option>5</option>
<option>6</option>
<option>7</option>
<option selected="selected">8</option>
<option value="9">8+</option>
</select>
</p>
Наша тестовая страничка после данного урока:
article_016.html ← кликните, чтобы посмотреть, как выглядит пример на данном сайте...
article_016.zip ← скачайте пример, чтобы установить на свой сайт...


*** Машина-Функционал для передвижения по страничкам курса HTML ***
:: :: /

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

Эти рисунки надо просто смотреть, а тексты к ним читать. Кликать кнопки следует на самом функционале.

Тропинка к данной страничке:
ГлавСтр :: Урок_00 :: Урок_01 :: Урок_01.4 :: Лаба_1 :: Урок_01.5 :: Урок_01.6 :: Урок_02 :: Урок_03 :: Урок_04 :: Урок_05 :: Урок_06 :: Урок_07 :: Урок_08 :: Урок_09 :: Урок_10 :: Урок_11 :: Урок_12 :: Урок_13 :: Урок_14 :: Урок_15 :: Урок 16

Следующие странички, рекомендуемые для посещения и изучения:
Урок 17

Страничка сделана на основе контента курса HTML сайта kocby.ru

© KOCI.INUMO.RU :: перепечатка материалов разрешается с указанием ссылки на домен KOCI.INUMO.RU ©