Atribut disabled
Atribut disabled blokira element
HTML obrazca,
kar pomeni, da ga naredi neaktivnega. Je atribut
brez vrednosti.
Blokiranje elementov je običajno potrebno zato, da uporabniku prepovemo spreminjati nekatere vrednosti (ki pa morajo biti kljub temu prikazane uporabniku v obliki elementov obrazca). Včasih elemente blokiramo (in odblokiramo) z uporabo JavaSctipt.
Vedenje
V primeru gumba (button
ali input
z atributom type v vrednostih button,
reset ali submit) blokada
pomeni, da gumba ni mogoče klikniti.
V primeru besedilnega vnosnega polja (input
ali textarea)
v njem ne bo mogoče spremeniti ali kopirati
besedila. V primeru potrditvenih polj
in radijskih gumbov
njihovega stanja (označeno ali ne) ni mogoče
spremeniti. V primeru spustnih seznamov
select
ni mogoče spremeniti izbranega elementa seznama.
Blokiran element ima privzeto sivo ozadje. Prav tako ne bo sodeloval v prehodih s tipko Tab.
Primer . Blokiran gumb
Blokirajmo gumb z atributom
disabled. Za primerjavo zraven primer
neblokiranega gumba (poskusimo ga
klikniti):
<button disabled>text</button>
<button>text</button>
:
Primer . Blokirano potrditveno polje
Zdaj pa poglejmo blokirano potrditveno polje. Za primerjavo zraven si oglejmo primer neblokiranega potrditvenega polja:
<input type="checkbox" disabled>
<input type="checkbox">
:
Primer . Blokirano in označeno potrditveno polje
Poglejmo si, kako izgleda blokirano
in z atributom checked
označeno potrditveno polje. Za primerjavo zraven
si oglejmo primer neblokiranega
označenega potrditvenega polja:
<input type="checkbox" disabled checked>
<input type="checkbox" checked>
:
Primer . Blokiran besedilni vnos
Zdaj pa blokirajmo vnosno polje. Za primerjavo zraven si oglejmo primer neblokiranega vnosnega polja:
<input type="text" value="text" disabled>
<input type="text" value="text">
:
Primer . Blokirano tekstovno območje
Tukaj bomo videli blokirano tekstovno območje (pozorni bodite na to, da je velikost blokiranega textarea mogoče spreminjati). Za primerjavo zraven si oglejmo primer neblokiranega tekstovnega območja:
<textarea disabled>text</textarea>
<textarea>text</textarea>
:
Primer . Blokiran spustni seznam
Poglejmo si, kako deluje blokiran
select.
Za primerjavo zraven si oglejmo primer neblokiranega
spustnega seznama:
<select disabled>
<option>city1</option>
<option selected>city2</option>
<option>city3</option>
<option>city4</option>
</select>
<select>
<option>city1</option>
<option selected>city2</option>
<option>city3</option>
<option>city4</option>
</select>
: