HTMLSelectElement.disabled
The HTMLSelectElement.disabled
is a boolean value that reflects the
disabled
HTML attribute, which indicates whether the control is disabled. If it is disabled, it
does not accept clicks. A disabled element is unusable and un-clickable.
Syntax
aSelectElement.disabled = aBool;
Example
HTML
<label>
Allow drinks?
<input id="allow-drinks" type="checkbox"/>
</label>
<label for="drink-select">Drink selection:</label>
<select id="drink-select" disabled>
<option value="1">Water</option>
<option value="2">Beer</option>
<option value="3">Pepsi</option>
<option value="4">Whisky</option>
</select>
JavaScript
var allowDrinksCheckbox = document.getElementById("allow-drinks");
var drinkSelect = document.getElementById("drink-select");
allowDrinksCheckbox.addEventListener("change", function(event) {
if (event.target.checked) {
drinkSelect.disabled = false;
} else {
drinkSelect.disabled = true;
}
}, false);
Result
Specifications
Specification |
---|
HTML Standard # dom-fe-disabled |
Browser compatibility
BCD tables only load in the browser