Elemento datalist en HTML

El elemento html datalist contiene elementos <option> que representan los valores disponibles para otros elementos del formulario. Un ejemplo de cómo definir un elemento <datalist> con una propiedad id, definir más de una opción usando el elemento <option> y asignar esta lista a un elemento a <input> través de la propiedad list:

< label > Elija su navegador de la lista:
 < input  type = "text"  list = "browsers"  name = "myBrowser" > </ label > 
< datalist  id = "browsers" > 
  < option  value = "Chrome" > 
  < option  value = "Firefox" > 
  < option  value = "Internet Explorer" > 
  <option  value = "Opera" > 
  <option  value = "Safari" > 
  < option  value = "Microsoft Edge" > 
</ datalist >

Etiqueta html datalist

Clasificaciones de contenido	Un elemento organizativo y un elemento ordinario.
Contenido permitido	Contenido regular o elemento `<option>` cero veces o más.
Acrónimo	Las etiquetas de inicio o finalización no se pueden omitir.
Elementos del padre	Cualquier elemento que acepte contenido normal.
Interfaz DOMO	`HTMLDataListElement`

Soporte de navegadores

Chrome	Firefox	Edge	Safari	Ópera
20	4.0	Soportado	No soportado	9.5

Características

En este elemento html datalist se pueden utilizar propiedades globales.

Formato predeterminado

La mayoría de los navegadores ocultan el elemento <datalist> estableciendo la propiedad display en none:

datalist {
  display: none;
}