このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。
HTMLSelectElement: disabled プロパティ
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。
HTMLSelectElement.disabled プロパティは論理値で、HTML の disabled 属性を反映し、このコントロールが無効であるかどうかを示します。無効であった場合、クリックを受け付けません。無効な要素は使用できず、クリックできません。
値
論理値です。
例
HTML
html
<label>
飲み物はいかが?
<input id="allow-drinks" type="checkbox" />
</label>
<label for="drink-select">飲み物の選択:</label>
<select id="drink-select" disabled>
<option value="1">水</option>
<option value="2">ビール</option>
<option value="3">ペプシ</option>
<option value="4">ウィスキー</option>
</select>
JavaScript
js
const allowDrinksCheckbox = document.getElementById("allow-drinks");
const drinkSelect = document.getElementById("drink-select");
allowDrinksCheckbox.addEventListener(
"change",
(event) => {
drinkSelect.disabled = !event.target.checked;
},
false,
);
結果
[フレーム]
仕様書
| 仕様書 |
|---|
| HTML # dom-fe-disabled |
ブラウザーの互換性
ブラウザー互換性一覧表を表示するには、JavaScript を有効にしてください。