Atribut disabled
Atribut disabled blokira element
HTML forme,
odnosno čini ga neaktivnim. Predstavlja atribut
bez vrednosti.
Blokiranje elemenata obično je potrebno kako bi se zabranilo korisniku da menja neke vrednosti (koje, ipak, treba da budu prikazane korisniku u vidu elemenata forme). Ponekad se elementi blokiraju (i uklanja blokada) pomoću JavaSctipt-a.
Ponašanje
U slučaju dugmeta (button
ili input
sa atributom type u vrednostima button,
reset ili submit) blokiranje
znači da se dugme neće moći pritisnuti.
U slučaju sa poljem za unos teksta (input
ili textarea)
u njemu se neće moći promeniti ili kopirati
tekst. U slučaju čekboksova
i radio dugmadi
stanje (označeno ili ne) neće moći da se
promeni. U slučaju padajućih lista
select
neće moći da se promeni izabrana stavka liste.
Blokirani element podrazumevano ima sivu pozadinu. On takođe neće učestvovati u prelazima tasterom Tab.
Primer . Blokirano dugme
Hajde da blokiramo dugme pomoću atributa
disabled. Za poređenje, pored primer
neblokiranog dugmeta (pokušajmo da ga pritisnemo):
<button disabled>text</button>
<button>text</button>
:
Primer . Blokirani čekboks
A sada da pogledamo blokirani flačak čekboksa. Za poređenje, pored gledamo primer neblokiranog flačka:
<input type="checkbox" disabled>
<input type="checkbox">
:
Primer . Blokirani i označeni čekboks
Da pogledamo kako izgleda blokirani
i označeni pomoću atributa checked
flačak čekboksa. Za poređenje, pored
obratimo se primeru neblokiranog
označenog flačka:
<input type="checkbox" disabled checked>
<input type="checkbox" checked>
:
Primer . Blokirani tekstualni input
A sada da blokiramo input. Za poređenje, pored pogledajmo primer neblokiranog inputa:
<input type="text" value="text" disabled>
<input type="text" value="text">
:
Primer . Blokirana textarea
Ovde ćemo videti blokiranu textareu (obratite pažnju da se veličina blokirane textarea može menjati). Za poređenje, pored obratimo se primeru neblokirane textarea:
<textarea disabled>text</textarea>
<textarea>text</textarea>
:
Primer . Blokirana padajuća lista
Hajde da pogledamo kako radi blokirana
select.
Za poređenje, pored pogledajmo primer neblokirane
padajuće liste:
<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>
: