САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ

Атрибут disabled



Определение и использование

Атрибут disabled, является логическим атрибутом.

При наличии disabled указывает, что элемент должен быть отключен.

Отключенный элемент непригоден для использования.

Атрибут disabled может быть установлен, чтобы пользователь не использовал до, некоторые другие условия были выполнены (например, выбор флажка и т. д.). Затем, JavaScript можно удалить значение disabled и использовать элемент.


Применение

Атрибут disabled можно использовать для следующих элементов:

Элемент Атрибут
<button> disabled
<fieldset> disabled
<input> disabled
<optgroup> disabled
<option> disabled
<select> disabled
<textarea> disabled

Примеры

Пример Button

Кнопка отключена:

<button type="button" disabled>Нажми на меня!</button>
Попробуйте сами »

Пример Fieldset

Отключение группы связанных элементов формы:

<fieldset disabled>
  <legend>Персонал:</legend>
  Имя: <input type="text"><br>
  Эл.Почта: <input type="text"><br>
  Дата рождения: <input type="text">
</fieldset>
Попробуйте сами »

Пример Input

Форма HTML с отключенным полем ввода:

<form action="/action_page.php">
 Имя: <input type="text" name="fname"><br>
 Фамилия: <input type="text" name="lname" disabled><br>
 <input type="submit" value="Отправить">
</form>
Попробуйте сами »

Пример Optgroup

Отключенная группа опций:

<select>
 <optgroup label="Немецкий автомобиль" disabled>
   <option value="Мерседес">Мерседес</option>
   <option value="Ауди">Ауди</option>
 </optgroup>
</select>
Попробуйте сами »

Пример Option

Раскрывающийся список с одним отключенным параметром:

<select>
 <option value="Вольво" disabled>Вольво</option>
 <option value="Сааб">Сааб</option>
 <option value="Фольксваген">Фольксваген</option>
 <option value="ауди">Ауди</option>
</select>
Попробуйте сами »

Пример Select

Раскрывающийся список отключен:

<select disabled>
 <option value="Вольво">Вольво</option>
 <option value="Сааб">Сааб</option>
 <option value="Мерседес">Мерседес</option>
 <option value="Ауди">Ауди</option>
</select>
Попробуйте сами »

Пример Textarea

Отключенная текстовая область:

<textarea disabled>
В SchoolsW3.com вы узнаете, как сделать сайт. Мы предлагаем бесплатные обучающие программы по всем технологиям веб-разработки.
</textarea>
Попробуйте сами »

Поддержка браузеров

Атрибут disabled имеет следующую поддержку браузера для каждого элемента:

Элемент
button Да Да Да Да Да
fieldset Да Not supported Да 7.0 Да
input 1.0 6.0 1.0 1.0 1.0
optgroup 1.0 8.0 Да Да Да
option 1.0 8.0 1.0 Да Да
select Да Да Да Да Да
textarea Да Да Да Да Да