HTMLInputElement: disabled プロパティ

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。

HTMLInputElement.disabled は disabled という HTML の属性を反映した論理値で、このコントロールが無効であるかどうかを表します。無効である場合、クリックを受け付けません。無効化された要素は使用できず、クリックもできません。

値

論理値です。

例

HTML

html
<p>
  <label>
    <input id="check-box" name="b" value="1" type="checkbox" disabled />
    このボックスをチェックしてください。
  </label>
</p>
<p>
  <label>
    <input id="toggle-box" name="b" value="2" type="checkbox" />
    もう一つのボックスを有効にします。
  </label>
</p>

JavaScript

js
const checkBox = document.getElementById("check-box");
const toggleBox = document.getElementById("toggle-box");

toggleBox.addEventListener(
  "change",
  (event) => {
    checkBox.disabled = !event.target.checked;
  },
  false,
);