复选框onclick事件处理程序和显示/隐藏功能

时间:2012-05-15 12:56:15

标签: php javascript checkbox event-handling

因此我尝试制作动态复选框,以便在点击时显示/隐藏某些内容。我有这个,但无法让它正常工作:

<html> 
<head> 
    <title>Checkbox Event Handler</title> 
    <style type="text/css"> 
        #myGroup {visibility:hidden} 
    </style> 
    <script type="text/javascript"> 
        function toggle(chkbox, group) { 
            var visSetting = (chkbox.checked) ? "visible" : "hidden"; 
            document.getElementById(group).style.visibility = visSetting; 
        } 
        function swap(radBtn, group) { 
            var modemsVisSetting = (group == "modems") ? ((radBtn.checked) ? "" : "none") : "none"; 
            document.getElementById("modems").style.display = modemsVisSetting; 
        } 
    </script>
    <?php require_once("/var/www/html/exercise/Task/functions.php"); ?>
</head> 
<body> 
    <?php
        $seqA[]="AAAAAAAAAAAAAAAAAAAAAAAAAAAAABBBBBBBBBBBBBBBBB";
        $seqA[]="BBBBBBBBBBBBBBBBBBBBBBBBBBCCCCCCCCCCCCCCCCCCDDDDDDDDDD0";
        $seqA[]="CCCCCCCCCCCCCCCCCCCCCCCCCCDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD";
    ?>
    <form>
    <?php
        $i=o;
        foreach($seqA as $seq){
    ?>
            <input type="checkbox" name="monitor"onclick="toggle(this, 'myGroup')" />show results
            <span id="myGroup">
     <?php
            $score=rawtransform(950);
            $truecol= getcolor($score,220);
            colorSequence($seq,5/*hit*/,$truecol,4);
        }
      ?>
            </span>
    </form>
</body>
</html>

它正常打开$ seqA中的第一个字符串并且工作正常但是第二个复选框在第一个字符串中? 我确定我做过一些非常愚蠢的事情,但我对编程很陌生。 有人帮忙吗?

2 个答案:

答案 0 :(得分:1)

我看到的问题是,在每个foreach循环迭代中,您添加具有相同span属性的元素id。设置唯一ID,将JavaScript toggle功能更改为指定span,并且该功能可用。

答案 1 :(得分:0)

我对PHP不是很熟悉,但看起来你生成了多个具有相同ID的span元素,这会导致document.getElementById以不可预测的方式行事。