MW211 EXIT

devlog
jQuery/disabledの動的変更
2011年12月26日
ボタンを押せる・押せない、チェックボックスをチェックできる・できない、など
要素の有効無効は「disabled="disabled"」(これは無効化)で指定するが
JavaScriptやjQueryで動的に変更する場合について。

まず、JavaScriptでの有効無効の設定は以下の通り。
┌──────────────────────────────────────┐
│document.getElementById("a").disabled = true;                               │
│document.getElementById("b").disabled = true;                               │
├──────────────────────────────────────┤
│document.getElementById("a").disabled = false;                              │
│document.getElementById("b").disabled = false;                              │
└──────────────────────────────────────┘

これをjQuery流にアレンジすると以下。
┌──────────────────────────────────────┐
│$("#a")[0].disabled = true;                                                 │
│$("#b")[0].disabled = true;                                                 │
├──────────────────────────────────────┤
│$("#a")[0].disabled = false;                                                │
│$("#b")[0].disabled = false;                                                │
└──────────────────────────────────────┘

そして、jQuery流を貫き通すと以下。
┌──────────────────────────────────────┐
│$("#a,#b").attr("disabled", "disabled");                                    │
├──────────────────────────────────────┤
│$("#a,#b").removeAttr("disabled");                                          │
└──────────────────────────────────────┘
分類:jQuery