/html/datalist:> Список вариантов поля ввода_
Элемент datalist
Синтаксис
HTML
<input list="[идентификатор]"> ... <datalist id="[идентификатор]"> <option value="..."> ... </datalist>
Описание
Элемент datalist (от англ. "data list" ‒ «список данных») устанавливает список возможных вариантов для поля ввода. При вводе текста будут показываться варианты (в виде выпадающего списка), которые совпадают по последовательности введённых символов.
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.[1]
IExplorer
Поддерж.
Safari
iOS
Android
- [1] ‒ не корректно.
Спецификация
| Верс. | Раздел |
|---|---|
| HTML | |
| 2.0 | |
| 3.2 | |
| 4.01 | |
| 5.0 | 4.10.8 The datalist element |
| 5.1 | 4.10.8. The datalist element |
| XHTML | |
| 1.0 | |
| 1.1 | |
Атрибуты
Пример использования
Листинг кода
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Элемент datalist</title>
</head>
<body>
<h1>Пример с элементом "datalist"</h1>
<h2>Укажите Ваше любимое блюдо</h2>
<input list="dish" placeholder="Название блюда">
<datalist id="dish">
<option value="Борщ">
<option value="Пельмени">
<option value="Пюре">
<option value="Суп">
<option value="Суши">
</datalist>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Элемент datalist</title>
</head>
<body>
<h1>Пример с элементом "datalist"</h1>
<h2>Укажите Ваше любимое блюдо</h2>
<input list="dish" placeholder="Название блюда">
<datalist id="dish">
<option value="Борщ">
<option value="Пельмени">
<option value="Пюре">
<option value="Суп">
<option value="Суши">
</datalist>
</body>
</html>
Элемент datalist