Element datalist

Element HTML datalist reprezentuje zestaw opcji (elementów option) dla innych kontrolek formularza. Treść znajdująca się poza elementami option w tym elemencie stanowi treść awaryjną używaną przez stare przeglądarki. Element datalist sam nie jest prezentowany na stronie internetowej. Jego opcje można zobaczyć tylko, gdy połączy się go z innym elementem. Element ten można łączyć z elementami input za pomocą atrybutu list, tzn. atrybut list elementu input musi mieć przypisany identyfikator (wartość atrybutu id) elementu datalist

Przykład użycia elementu HTML datalist

Element datalist powiązany z elementem input. Opcje tego elementu datalist zostaną wyświetlone jako menu kontekstowe elementu input

<input list="przegladarki">
<datalist id="przegladarki">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

W przeglądarce Chrome 108.0.5359.94 ten element wygląda tak:

Wygląd elementów input i datalist w Chrome 108

Wypróbuj u siebie:

Kontekst użycia

Modele treści HTML5treść ogólna, syntagmatyczna
Elementy nadrzędneelementy treści ogólnej
Elementy potomne

elementy treści ogólnej, option

ZnacznikiZnaczniki otwierający i zamykający są obowiązkowe
NormyHTML 5 — podrozdział 4.10.10
Interfejs DOMHTMLDataListElement
Różnice między HTML 4.01 a HTML 5

Element datalist został dodany w języku HTML 5

Obsługa przez przeglądarki

FirefoxChromeOperaSafariInternet Explorer
✔ — od wersji 10

Atrybuty obowiązkowe

Element datalist nie ma atrybutów obowiązkowych.

Atrybuty opcjonalne

Atrybuty globalne

Podobał Ci się ten artykuł?

Oceń go!

Średnia 0 / 5. Liczba głosów: 0

Jeszcze nikt nie głosował. Wyprzedź innych i zagłosuj.

Skoro spodobał Ci się ten artykuł...

Poleć go znajomym!

Ojej :( Powiedz nam, co powinniśmy poprawić!

Jajko z dzwonkiem
Podoba Ci się ta strona?

Pomóż nam się rozwijać, wykupując płatne konto. Dzięki temu będziemy mogli tworzyć dla Ciebie jeszcze więcej ciekawych treści, a Ty pozbędziesz się reklam.

Zobacz również

    Dodaj komentarz

    dziewięć + 8 =