このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

HTMLSelectElement: disabled プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨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, ); 

結果

仕様書

Specification
HTML
# dom-fe-disabled

ブラウザーの互換性