Атрыбут disabled
Атрыбут disabled блакіруе элемент
HTML формы,
то ёсць робіць яго неактыўным. З'яўляецца атрыбутам
без значэння.
Блакіроўка элементаў звычайна патрэбная для таго, каб забараніць карыстальніку мяняць некаторыя значэнні (якія, тым не менш, павінны быць паказаныя карыстальніку ў выглядзе элементаў формы). Часам элементы блакіруюць (і здымаюць блакіроўку) з дапамогай JavaSctipt.
Паводзіны
У выпадку кнопкі (button
ці input
з атрыбутам type у значэннях button,
reset ці submit) блакіроўка
азначае, што на кнопку нельга будзе націснуць.
У выпадку з тэкставым полем ўводу (input
ці textarea)
у ім нельга будзе памяняць ці скапіяваць
тэкст. У выпадку з чекбоксамі
і радыё
іх стан (адзначана ці не) нельга будзе
змяніць. У выпадку з выпадальнымі спісамі
select
нельга будзе змяніць абраны пункт спісу.
Заблакаваны элемент па змаўчанні мае шэры фон. Ён таксама не будзе ўдзельнічаць у пераходах клавішай Tab.
Прыклад . Заблакаваная кнопка
Давайце заблакуем кнопку з дапамогай атрыбута
disabled. Для параўнання побач прыклад
незаблакаванай кнопкі (паспрабуем на яе
націснуць):
<button disabled>text</button>
<button>text</button>
:
Прыклад . Заблакаваны чэкбокс
А цяпер давайце паглядзім на заблакаваны флажок чэкбокса. Для параўнання побач глядзім прыклад не заблакаванага флажка:
<input type="checkbox" disabled>
<input type="checkbox">
:
Прыклад . Заблакаваны і адзначаны чэкбокс
Давайце паглядзім, як выглядае заблакаваны
і адзначаны з дапамогай атрыбута checked
флажок чэкбокс. Для параўнання побач
звернемся да прыкладу не заблакаванага
адзначанага флажка:
<input type="checkbox" disabled checked>
<input type="checkbox" checked>
:
Прыклад . Заблакаваны тэкставы інпут
А цяпер давайце заблакуем інпут. Для параўнання побач паглядзім прыклад не заблакаванага інпута:
<input type="text" value="text" disabled>
<input type="text" value="text">
:
Прыклад . Заблакаваная тэкстаarea
А тут мы ўбачым заблакаваную тэкстаarea (звярніце ўвагу на тое, што памер заблакаванага textarea можна мяняць). Для параўнання побач звернемся да прыкладу не заблакаванай тэкстаarea:
<textarea disabled>text</textarea>
<textarea>text</textarea>
:
Прыклад . Заблакаваны выпадальны спіс
Давайце паглядзім як працуе заблакаваны
select.
Для параўнання побач паглядзім прыклад не заблакаванага
выпадальнага спісу:
<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>
:
