Javascriptで入力オブジェクトの有効／無効切り替え

by mogice · 2015-06-05

Javascriptで入力オブジェクト（テキストボックス、チェックボックス、ラジオボタン、リストなど）の有効／無効を切り替える方法。

// 無効とするオブジェクト

var invalidList = [ "text1", "checkbox1", "radio1" ];

changeDisabled(invalidList, true);

// 有効とするオブジェクト

var validList = [ "text2", "checkbox2", "radio2" ];

changeDisabled(validList, false);

//-------------------------------------------------------------------------------

// 有効／無効設定

//-------------------------------------------------------------------------------

function changeDisabled(list, flag) {

for (var i = 0; i < list.length; i++) {

var elemList = document.getElementsByName(list[i]);

for (var j = 0; j < elemList.length; j++) {

// テキストエリアの場合は値をクリア

if (elemList[j].nodeName == "TEXTAREA") {

elemList[j].value = "";

}

// テキストタイプの場合は値をクリア

if (elemList[j].type == "text") {

elemList[j].value = "";

}

// チェック状態を解除

elemList[j].checked = false;

// 有効／無効切り替え

elemList[j].disabled = flag;

}