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>