Elemento datalist en HTML

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 contenidoUn elemento organizativo y un elemento ordinario.
Contenido permitidoContenido regular o elemento <option> cero veces o más.
AcrónimoLas etiquetas de inicio o finalización no se pueden omitir.
Elementos del padreCualquier elemento que acepte contenido normal.
Interfaz DOMOHTMLDataListElement

Soporte de navegadores

ChromeFirefoxEdgeSafariÓpera
204.0SoportadoNo soportado9.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;
}