Etiqueta HTML <datalist>
Ejemplo
Una lista de datos con opciones predefinidas (conectadas a un elemento <input>):
<label for="browser">Elija su navegador de la lista:</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>
Try it Yourself »
Definición y uso
La etiqueta <datalist>
especifica una lista de opciones predefinidas para un elemento <input>.
La etiqueta <datalist>
se utiliza para proporcionar una función de "autocompletar" para los elementos <input>. Los usuarios verán una lista desplegable de opciones predefinidas a medida que ingresan datos.
El atributo id del elemento <datalist>
debe ser igual al atributo de lista del elemento <input> (esto los une).
Soporte del navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el elemento.
Elemento | |||||
---|---|---|---|---|---|
<datalist> | 20.0 | 10.0 | 4.0 | 12.1 | 9.5 |
Atributos globales
La etiqueta <datalist>
también soporta los Atributos Globales en HTML.
Atributos del evento
La etiqueta <datalist>
también soporta los Atributos de Evento en HTML.
Páginas relacionadas
Referencia HTML DOM: Objeto de Datalist.
Configuración CSS predeterminada
La mayoría de los navegadores mostrarán el elemento <datalist>
con los siguientes valores predeterminados:
datalist {
display: none;
}