あぼかどブログ > Web > HTML > formタグ:複数のチェックボックスを全て選択する(メモ)

formタグ:複数のチェックボックスを全て選択する(メモ)

htmlのformタグの複数のチェックボックスを全選択、非選択に切り替える(メモ)
チェックボックス非チェック状態
(イメージ)上記の項目A、項目B、項目Cを全てチェックする。

javascript例

<script language="JavaScript" type="text/javascript">
function AllChecked() {
var check = document.Form.allcheck.checked;
document.Form.elements['check_item[3]'].checked = check;
document.Form.elements['check_item[2]'].checked = check;
document.Form.elements['check_item[1]'].checked = check;
}
</script>

htmlのフォーム例

<form action="http://xxxxxxxxxxxxxxx/" method="POST" name="Form">
<input type="checkbox" name="allcheck" onClick="AllChecked();" /> ← 全てチェック
<br />
<hr>
<input type="checkbox" name="check_item[3]" value="3" />:項目A<br />
<input type="checkbox" name="check_item[2]" value="2" />:項目B<br />
<input type="checkbox" name="check_item[1]" value="1" />:項目C<br />
<hr>

全チェックのイメージ

全チェックボックスONの状態
一番上のボックス選択で、ON/OFFを切り替える。

【前後の記事】
«
 
»
 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です