第36回 「チェックボックス」


 今回はチェックボックスについて説明します。チェックボックスはテキストフィールドのようにいろいろな値/文字を持つわけではありません。単純にチェックされたか、されていないかの2つの状態しかありません。この状態を調べるには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>

 次回はラジオボタンについて説明します。





2002-2004 Copyright KaZuhiro FuRuhata (古籏一浩)