Тег <datalist>
Описание
Выпадающий список для тега input, который появляется при наведении курсора мыши на данный input ( на пк ) или при нажатии на стрелку рядом ( на мобильных устройствах ). Позволяет показывать варианты для ввода с сортировкой по вводимым символам.
Для элемента доступны универсальные атрибуты и события.
См. код языков.
См. MIME - типы.
Синтаксис
<input list='идентификатор'>
<datalist id='идентификатор'>
<option value='Текст1'>
<option value='Текст2'>
</datalist>
Internet Explorer | Edge | Chrome | Opera | Safari | Firefox | Android WebView | Firefox для Android | Opera для Android | iOS Safari |
10 | 12 | 20 | 9.5 | 4 | 3 | 4 | 10 |
Поддерживается | Частичная поддержка | Не поддерживается |
Атрибуты
Устаревшие атрибуты
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<p>Выберите любимый фильм:</p>
<p>
<input list='list-film'>
<datalist id='list-film'>
<option value='Солдатик'>
</option>
<option value='Чебурашка'>
</option>
<option value='Другое'>
</option>
</datalist>
</p>
</body>
</html>
Выберите любимый фильм:
Читайте также
Тег <canvas>
Создает область, в которой можно рисовать объекты при помощи JavaScript. Чаще всего используется ...
Тег <main>
Выделяет основное содержание сайта. Семантический тег.
Тег <h1> - <h6>
Создает заголовок. Главное правило, <b>не дублировать h1</b>.
Тег <col>
Задает столбец в таблице и используется для стилизации ячеек.
Тег <p>
Используется для создания параграфа.