HTML - тег <datalist>


Пример

Список данных с предопределенными параметрами (связанный с элементом <input>):

<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">

<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

Определение и использование

Тег <datalist>указывает список предопределенных параметров для элемента <input>.

Тег <datalist>используется для предоставления функции «автозаполнения» для элементов <input>. При вводе данных пользователи увидят раскрывающийся список предопределенных параметров.

Атрибут <datalist>id элемента должен быть равен атрибуту списка элемента <input> (это связывает их вместе).


Поддержка браузера

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

Element
<datalist> 20.0 10.0 4.0 12.1 9.5

Глобальные атрибуты

Тег <datalist>также поддерживает глобальные атрибуты в HTML .


Атрибуты события

Тег <datalist>также поддерживает атрибуты событий в HTML .


Связанные страницы

Справочник по HTML DOM: Объект Datalist


Настройки CSS по умолчанию

Большинство браузеров будут отображать <datalist>элемент со следующими значениями по умолчанию:

datalist {
  display: none;
}