Атрибут disabled тега <optgroup> — блокування групи пунктів
Атрибут disabled HTML тега являється логічним атрибутом. Блокує доступ до групи списку, при цьому група відображається іншим кольором (зазвичай сірим) і недоступна для вибору.
Атрибут disabled може бути встановлений, щоб вберегти користувача від вибору optgroup, поки деяка інше умова не буде виконана (наприклад, не вибраний прапорець, і т.д.). Потім за допомогою JavaScript можна зробити optgroup доступною для вибору.
Загальний опис
автор: NagarD
Синтаксис
<optgroup disabled>Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | 7 | 15 | 12 | 8 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | — |
Приклади
+ запропонувати свій приклад у пісочниці
Найпростіший приклад використання HTML атрибута disabled теґа <optgroup>
HTML
<h3>Приклад з використанням атрибуту <code>disabled</code></h3>
<p>Для вибору кольору чи відтінка нажміть на кружечок</p>
Розблокувати колір <input type = "radio" id="myButton" name = "sex"value = "male">
Розблокувати відтінок <input type = "radio" id="myBut" name = "sex"value = "female" >
<p><select>
<optgroup label="Колір" id="MyButton" disabled="">
<option value="Синій">Синій</option>
<option value="Жовтий">Жовтий</option>
<option value="Червоний">Червоний</option>
</optgroup>
<optgroup label="Відтінок" id="Button" disabled="">
<option value="Світлий" >Світлий</option>
<option value="Темний">Темний</option>
<option value="Нормальний">Нормальний</option>
</optgroup>
</select></p>
<p><button>Надіслати</button></p>JS
document.getElementById('myButton').onclick = function () {
document.getElementById('Button').disabled = true;
document.getElementById('MyButton').disabled = false;
};
document.getElementById('myBut').onclick = function () {
document.getElementById('Button').disabled = false;
document.getElementById('MyButton').disabled = true;
};
//# sourceURL=pen.jsНайпростіший приклад використання HTML атрибута disabled теґа <optgroup>
<h3>Приклад з використанням атрибуту <code>disabled</code></h3>
<p><select name="type">
<optgroup label="Українські письменники" disabled>
<option value="Ліна Костенко">Ліна Костенко</option>
<option value="Тарас Шевченко">Тарас Шевченко</option>
<option value="Ольга Кобилянська">Ольга Кобилянська</option>
</optgroup>
<optgroup label="Зарубіжні письменники" disabled>
<option value="Анна Ахматова">Анна Ахматова</option>
<option value="Чарлз Діккенс">Чарлз Діккенс</option>
<option value="Вільям Шекспір">Вільям Шекспір</option>
</optgroup>
</select></p>
<br>
<h3>Приклад без використання атрибуту <code>disabled</code></h3>
<p><select name="type">
<optgroup label="Українські письменники" >
<option value="Ліна Костенко">Ліна Костенко</option>
<option value="Тарас Шевченко">Тарас Шевченко</option>
<option value="Ольга Кобилянська">Ольга Кобилянська</option>
</optgroup>
<optgroup label="Зарубіжні письменники">
<option value="Анна Ахматова">Анна Ахматова</option>
<option value="Чарлз Діккенс">Чарлз Діккенс</option>
<option value="Вільям Шекспір">Вільям Шекспір</option>
</optgroup>
</select></p>Різниця між XHTML та HTML
У XHTML мінімізований запис атрибутів заборонено,тому атрибут disabled має бути визначений як <optgroup disabled="disable">
Коментарі
Коментарів ще немає — будьте першим!