第36回 「チェックボックス」
今回はチェックボックスについて説明します。チェックボックスはテキストフィールドのようにいろいろな値／文字を持つわけではありません。単純にチェックされたか、されていないかの２つの状態しかありません。この状態を調べるにはcheckedを使って読み出します。例えば最初のフォームにある最初のチェックボックスの状態を変数flagに読み込むには以下のようになります。
flag = document.forms[0].elements[0].checked;
読み出された状態はtrueまたはfalseのどちらかになります。これらは
true ... チェックされている
false .. チェックされていない
事を示しています。
以下がフォーム内にあるチェックボックスでチェックされている数をアラートダイアログに表示するプログラムです。
<html>
<head>
<title></title>
<script language="JavaScript"><!--
function check()
{
n = 0;
for (i=0; i<3; i++)
{
flag = document.forms[0].elements["CB"+i].checked;
if (flag == true) n = n + 1;
}
alert(n);
}
// --></script>
</head>
<body>
<form>
<input type="checkbox" name="CB0"><input type="text"><br>
<input type="checkbox" name="CB1"><input type="text"><br>
<input type="checkbox" name="CB2"><input type="text"><br>
<input type="button" value="チェック数を調べる" onClick="check()">
</form>
</body>
</html>
次回はラジオボタンについて説明します。