[Javascript] フォームの要素名に変数を設定する方法

[Javascript] フォームの要素名に変数を設定する方法

JavaScriptでフォーム内の要素(エレメント)を取り扱う際、要素名を変数で置き換えたい時があります。
詳細は以下から。

Javascriptでフォームの要素名に変数を設定

要素名が『column_X』の様にXXの部分が連番になっている要素に対して、文字が入力されているかというチェックをJavaScriptのfor文で一括処理してみます。

<script type="text/javascript">
function formSubmit01(){
	for (var count = 1; count <= 5; count++){
		var columnName = "column_" + count;
		if (document.form1[columnName].value == ""){
			alert("項目" + count + "が入力されていません");
			return false;
		}
	}
	document.form1.submit();
}
</script>
<form action="./" method="post" name="form1">
項目1：<input type="text" name="column_1" value="" size="10" /><br />
項目2：<input type="text" name="column_2" value="" size="10" /><br />
項目3：<input type="text" name="column_3" value="" size="10" /><br />
項目4：<input type="text" name="column_4" value="" size="10" /><br />
項目5：<input type="text" name="column_5" value="" size="10" /><br />
<input type="button" value="確　　認" onClick="formSubmit01()" />
</form>

通常『document.form1.column_X』の様に記述する部分を『document.form1[column_X]』と記述します。

関連記事