Главная/ Cправочник HTML, CSS, Javascript/ HTML справочник : HTML теги, HTML атрибуты, мета теги, спецсимволы/ Tags/ HTML тег select | назначение, синтаксис, атрибуты, примеры

Тег select

Последнее обновление: 23.01.2011

Тег <select> (с англ. выделение) — тег-контейнер, для тегов <option>, создает элемент выбора значений.
Строчный элемент.

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис


<select>
<option>...</option>
</select>

Атрибуты



acceskey горячая клавиша (+Alt) для элемента
class определяет имя используемого класса
dir определяет направление символов:

  • ltr — слева направо
  • rtl — справа налево
disabled флаг. Делает спискок неактивным. Не поддерживается в IE
id уникальный идентификатор
lang определяет используемый язык
multiple флаг. Разрешает одновременный выбор нескольких элементов списка
name уникальное имя списка
onblur потеря фокуса элементом
onchange потеря фокуса элементом при условии, что его содержимое изменилось
onclick щелчок на элементе
ondblclick двойной щелчок на элементе
onfocus получение фокуса элементом
onkeydown нажатие клавиши, когда элемент имеет фокус
onkeypress нажатие и освобождении клавиши, когда элемент имеет фокус
onkeyup освобождение ранее нажатой клавиши, когда элемент имеет фокус
onmousedown нажатие кнопки мыши, когда элемент имеет фокус
onmousemove движение указателя мыши, когда элемент имеет фокус
onmouseout смещение указателя мыши с элемента
onmouseover помещение указателя мыши на элемент
onmouseup освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус
onselect выделение какого-либо текста в текстовом поле
size количество одновременно отображаемых строк
style задает встроенную таблицу стилей
tabindex порядок обхода элементов с помощью Tab
title всплывающая подсказка
value значение выбранное пользователем в списке.
Отсутствует в спецификации HTML 4.01!

Пример

Обычный выпадающий список:


<select>
<option selected="selected">Прямоугольник</option>
<option>Квадрат</option>
<option>Ромб</option>
</select>

Развернутый список с множественным выбором (чтобы выбрать одновременно несколько значений, удерживайте ctrl (или shift) и кликните по нескольким значениям):


<select multiple="multiple" size="3">
<option>Красный</optoin>
<option>Зеленый</option>
<option>Синий</option>
</select>

Рекомендации по использованию

  • закрывающий тег обязателен (</select>)
  • должен содержать теги <option> и <optgroup> — элементы списка
  • обязательных атрибутов нет

Если вы планируете отправлять результат выбора на сервер, нужно заключить тег в контейнер <form>.

Твой код:

Результат: