[JavaScript] チェックボックスがチェックされているか確認する方法

自由が丘で働くWeb屋のブログ

[JavaScript] チェックボックスがチェックされているか確認する方法

[JavaScript] チェックボックスがチェックされているか確認する方法

HTMLのフォーム内にあるチェックボックス(checkbox)がチェックされているかどうか、確認したい時があります。
JavaScriptを用いてフォーム内のチェックボックスがチェックされているか確認する方法は以下から。

チェックボックスがチェックされているか確認する方法

特定のチェックボックスの状態を確認するには
【document.formタグのname属性.checkboxタグのname属性.checked】
を確認します。
チェックされている場合はtrue、チェックされていない場合はfalseが帰ってきます。

<script type="text/javascript">
checkCheckBox(){
	checkbox_check = document.form1.hoge.checked;
	if(checkbox_check){
		alert("チェックされています");
	}else{
		alert("チェックされていません");
	}
}
</script>
<form name="form1" action="./" method="post">
<input type="checkbox" name="hoge" />hoge<br />
<input type="button" value="submit" onclick="checkCheckBox();" />
</form>

チェックされている場合はsubmitし、チェックされていない場合のみsubmitせずにアラートを出したい場合は、下記の様に書くことができます。

<script type="text/javascript">
function checkCheckBox(){
	checkbox_check = document.form1.hoge.checked;
	if(!checkbox_check){
		alert("チェックされていません");
		return false;
	}
	document.form1.submit();
}
</script>
</head>
<body>
<form name="form1" action="./" method="post">
<input type="checkbox" name="hoge" />hoge<br />
<input type="button" value="submit" onclick="checkCheckBox();" />
</form>
 
カテゴリー:Webシステム開発
タグ:,
2012年10月1日 11時09分
 

関連記事

 

コメントを書く

This blog is kept spam free by WP-SpamFree.

(C) 自由が丘で働くWeb屋のブログ
Get Adobe Flash player