| ポイント |
<![CDATA[
fOBJ = document.myFORM;
count = 0;
for (i=1; i<=5; i++) if (fOBJ["CB"+i].checked) count++;
if (count > 3)
{
alert("３個以上チェックできません");
fOBJ["CB"+n].checked = false;
}
]]>
|
| 説 明 |
チェックボックスを特定の数しかチェックできないようにするにはonClickイベントでクリックを検知しfor命令を使っていくつチェックされているかを調べます。チェックボックス名を"CB1"、"CB2"、"CB3"....のように名前+番号にしておけば「document.フォーム名[名前"+番号].checked」でチェックボックスの読み込み、設定ができます。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>５個のうち３個しかチェックできないようにする</title>
<script Language="JavaScript"><!--
function check(n)
{
fOBJ = document.myFORM;
count = 0;
for (i=1; i<=5; i++) if (fOBJ["CB"+i].checked) count++;
if (count > 3)
{
alert("３個以上チェックできません");
fOBJ["CB"+n].checked = false;
}
}
// --></script>
</head>
<body>
<form name="myFORM">
<input type="checkbox" name="CB1" onClick="check(1)">チェック１<br>
<input type="checkbox" name="CB2" onClick="check(2)">チェック２<br>
<input type="checkbox" name="CB3" onClick="check(3)">チェック３<br>
<input type="checkbox" name="CB4" onClick="check(4)">チェック４<br>
<input type="checkbox" name="CB5" onClick="check(5)">チェック５<br>
</form>
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
５個のうち３個しかチェックできないようにする