Disabled-attribuut
Die attribuut disabled skakel 'n
HTML-vorm-element uit,
dit maak dit onaktief. Dit is 'n waarde-lose attribuut.
Die uitskakeling van elemente is gewoonlik nodig om te verhoed dat die gebruiker sekere waardes verander (wat nietemin aan die gebruiker getoon moet word as vormelemente). Soms word elemente deur JavaScript uitgeskakel (en weer ingeskakel).
Gedrag
In die geval van 'n knoppie (button
of input
met die attribuut type op die waardes button,
reset of submit) beteken uitskakeling
dat die knoppie nie gedruk kan word nie.
In die geval van 'n teksinvoerveld (input
of textarea)
kan die teks nie daarin verander of gekopieër word nie.
In die geval van merkieskassies
en keuseknoppies
kan hul toestand (gemerk of nie) nie verander word nie.
In die geval van keuselyste
select
kan die gekose lysitem nie verander word nie.
'n Uitgeskakelde element het standaard 'n grys agtergrond. Dit sal ook nie deelneem aan Tab-sleutel oorgange nie.
Voorbeeld . Uitgeskakelde knoppie
Kom ons skakel 'n knoppie uit met die attribuut
disabled. Ter vergelyking is daar 'n voorbeeld
van 'n nie-uitgeskakelde knoppie langsaan (kom ons probeer dit
druk):
<button disabled>teks</button>
<button>teks</button>
:
Voorbeeld . Uitgeskakelde merkieskassie
Kom ons kyk nou na 'n uitgeskakelde merkieskassie-vlaggie. Ter vergelyking kyk ons na 'n voorbeeld van 'n nie-uitgeskakelde vlaggie langsaan:
<input type="checkbox" disabled>
<input type="checkbox">
:
Voorbeeld . Uitgeskakelde en gemerkte merkieskassie
Kom ons kyk hoe 'n uitgeskakelde
en gemerkte merkieskassie-vlaggie met die attribuut checked
lyk. Ter vergelyking kyk ons na 'n voorbeeld
van 'n nie-uitgeskakelde gemerkte vlaggie langsaan:
<input type="checkbox" disabled checked>
<input type="checkbox" checked>
:
Voorbeeld . Uitgeskakelde teksinvoer
Kom ons skakel nou 'n invoer uit. Ter vergelyking kyk ons na 'n voorbeeld van 'n nie-uitgeskakelde invoer langsaan:
<input type="text" value="teks" disabled>
<input type="text" value="teks">
:
Voorbeeld . Uitgeskakelde teksarea
En hier sien ons 'n uitgeskakelde teksarea (let op dat die grootte van die uitgeskakelde textarea verander kan word). Ter vergelyking kyk ons na 'n voorbeeld van 'n nie-uitgeskakelde teksarea langsaan:
<textarea disabled>teks</textarea>
<textarea>teks</textarea>
:
Voorbeeld . Uitgeskakelde keuselys
Kom ons kyk hoe 'n uitgeskakelde
select werk.
Ter vergelyking kyk ons na 'n voorbeeld van 'n nie-uitgeskakelde
keuselys langsaan:
<select disabled>
<option>stad1</option>
<option selected>stad2</option>
<option>stad3</option>
<option>stad4</option>
</select>
<select>
<option>stad1</option>
<option selected>stad2</option>
<option>stad3</option>
<option>stad4</option>
</select>
: