Тег datalist

Справочник:

Тег

Характеристики тега

В каких браузерах работает?


10.0+	20.0+	9.6+	-	4.0+	-	-

В каких спецификациях используется?

HTML

5.0

XHTML

Для чего используется?

Отвечает за формирования подсказок при заполнении текстовых полей. Изначально эти подсказки не выводятся. Для просмотра и выбора они становятся доступны при фокусировке на заданном текстовом поле. С текстовым полем тег <datalist> связывается с помощью идентификатора (они должны быть идентичны).

Как правильно задавать?

<input list="id">
<datalist id="id">
 <option value="подсказка1">
 <option value="подсказка2">
</datalist>

Какие атрибуты поддерживаются?

Единым значимым атрибутом для <datalist> является id. Для привязки к определенному полю идентификатор должен совпадать с атрибутом list текстового поля.

Закрытый тег

Да.

Пример использования

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег datalist</title>
 </head>
 <body>
  <p>Укажите страну:</p>
  <p><input list="contry">
   <datalist id="contry">
    <option value="Украина"></option>
    <option value="Россия"></option>
    <option value="Беларусь"></option>
   </datalist></p>
 </body>
</html>

По итогу получаем

Тип html тега:

HTML5