Hvad bruges option elementet til?

HTML-elementet option bruges til at definere mulighederne i en drop-down-liste, der er en del af et HTML-formularelement. Det gør det muligt for brugeren at vælge én eller flere værdier fra en liste.

Et option element er defineret ved at indsætte en start- og sluttag indenfor den samme linje. Starttagget definerer option og sluttagget afslutter elementet.

Inde i elementet skal der specificeres en værdi, som er den værdi, der gemmes i formularen. Denne værdi kan ikke vises på skærmen, men bruges til at identificere det valgte element.

Ud over værdien kan der indsættes en label, som er den tekst, der vises på skærmen for brugeren. Det kan være et ord eller en sætning.

Derudover er der mulighed for at specificere, om et element er valgt som standard eller ej. Dette gøres ved at tilføje attributten selected til elementet.

Alt i alt gør HTML-elementet option det muligt for brugeren at foretage et valg fra en liste af muligheder. Det giver mulighed for at gemme de valgte værdier i formularen, så de kan sendes til webserveren.

Eksempler på option

Eksempel 1:

<select>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”fiat”>Fiat</option>
<option value=”audi”>Audi</option>
</select>

Denne kode viser en dropdown menu på websiden med fire forskellige muligheder: Volvo, Saab, Fiat og Audi.

Eksempel 2:

<select>
<option value=”1″>København</option>
<option value=”2″>Aarhus</option>
<option value=”3″>Odense</option>
<option value=”4″>Aalborg</option>
</select>

Denne kode viser en dropdown menu på websiden med fire forskellige byer: København, Aarhus, Odense og Aalborg.

Eksempel 3:

<select>
<option value=”1″>Apple</option>
<option value=”2″>Banana</option>
<option value=”3″>Orange</option>
<option value=”4″>Strawberry</option>
</select>

Denne kode viser en dropdown menu på websiden med fire forskellige frugter: Apple, Banana, Orange og Strawberry.