Taggen select
Taggen select skapar en rullgardinsmeny
för användning i HTML formulär.
En enskild punkt i listan ska lagras i
taggen option.
Attribut
| Attribut | Beskrivning |
|---|---|
multiple |
Närvaron av detta attribut skapar en multiselekt -
en rullgardinsmeny där flera punkter kan väljas genom att hålla nere
tangenten Ctrl eller markera dem med musen.
Frivilligt attribut. |
name |
Rullgardinsmenyns namn. Behövs för att kunna hämta inmatningsfältets data i PHP. För att formuläret ska fungera korrekt får inmatningsfälten inte ha samma namn som varandra (i ett och samma formulär). Om de är lika kommer data i PHP från det inmatningsfält som ligger lägre i HTML-koden. |
Exempel
Låt oss se hur en rullgardinsmeny fungerar:
html<select>
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Exempel
Låt oss göra bredden på rullgardinsmenyn
lika med bredden på det största elementet (om
den inte uttryckligen anges med CSS-egenskapen
width):
html<select>
<option>Big City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Exempel . Standardval
Låt oss nu försöka välja en stad
som standard. Vi gör detta med attributet
selected:
html<select>
<option>Big City1</option>
<option selected>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Exempel . Multiselekt
Låt oss nu omvandla en vanlig selekt till en
multiselekt med attributet multiple:
html<select multiple name="city[]">
<option>City1</option>
<option>City2</option>
<option>City3</option>
<option>City4</option>
</select>
Результат:
Observera att selektens namn, angivet i attributet name,
måste ha hakparenteser i slutet. Detta behövs för att alla valda värden ska komma fram till PHP
(annars kommer bara ett - det sista).
Exempel . Flera standardvärden i multiselekt
Låt oss nu, i multiselekten som standard, försöka välja mer än ett värde:
html<select multiple name="city[]">
<option>City1</option>
<option selected>City2</option>
<option>City3</option>
<option selected>City4</option>
</select>
Результат: