最新の更新情報

 
このブログ「吟遊詩人の戯言」 の記事検索...

javascriptを使ってチェックボックス数の算出や,チェック数の算出の方法

関連記事

いや,必要に迫られて,作ってみたり
HTMLドキュメント内の,入力エリアに存在する
チェックボックスの数を数えたり,チェックされている数を計算したりする方法を,書いておきまする

肝は,チェックボックスが1個の時と複数個の時の動き

複数個の時は,javascript内にて配列で取得できますが
1個の時は,配列として認識してくれませんです

ですので,まずは,チェックボックスの総数を計算

1個の時と複数個の時の処理を分けてみました

もちっと,エレガントに書けそうな気がすけど,とりあえず,動いているんで,ヨシとしよう(爆

例のごとく,バグってたら,済まないですぅ(汗

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題ドキュメント</title>

<SCRIPT language="JavaScript">
<!--
function checktest() {
    var TestValue = "";
    var TestValue2 = 0;
    
    var cnt = 0;
    
    for (e = 0; e < document.formTest.elements.length; e++){     //チェックボックスの数を数える
        if(document.formTest.elements&#91;e&#93;.type == "checkbox")
        {
            cnt++;
        }    
    }

    if (cnt == 1)    //1個の時
    {
        if (document.formTest.test.checked == true) {
            TestValue += document.formTest.test.value;
            TestValue2 = 1;
        }
    }
    else            //複数個の時
    {
        for (i=0;i<2;i++) {
            if (document.formTest.test&#91;i&#93;.checked == true) {
                TestValue += document.formTest.test&#91;i&#93;.value;
                TestValue2++;
            }
        }
    }
    window.alert(TestValue2);
}
-->
</SCRIPT>
</head>

<body>
<h1>てすと</h1>

<FORM name="formTest">
<input type="checkbox" name="test" value="test1" onclick="checktest()">test1<br>
<input type="checkbox" name="test" value="test2" onclick="checktest()">test2<br>
<input type="button" value="test" onclick="checktest()">
</FORM>

</body>
</html>

 
 
 
 

Leave a Reply

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <img localsrc="" alt="">