Question

为什么第一个复选框工作但不是第二个复选框，我做错了什么？：S

 <meta http-equiv="Content-type" value="text/html; charset=UTF-8" />

 <script type="text/javascript" language="javascript">
 function SetAllCheckBoxes(FormName, AreaID)
 {

 if(!document.forms[FormName])
 return;
 var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
 if(!objCheckBoxes)
 return;
 var countCheckBoxes = objCheckBoxes.length;
 if(!countCheckBoxes)
 objCheckBoxes.checked = CheckValue;
 else
 for(var i = 0; i < countCheckBoxes; i++)
 objCheckBoxes[i].checked = false;
 }
 </script>


 </head>

 <div id="items">
  <input name="checkall" type="checkbox" onclick="SetAllCheckBoxes('SelectedItems','items');"><br>
 <form name="SelectedItems" action="" method="post">
 <b>Select/Unselect All</b><br>


 <input id="idGSSmodules" type="checkbox" name="GSS" >
 <label for="idmodules">GSS</label><br>
 <input type="checkbox" name="GTS" id="idGSSmodules">
 <label for="idmodules">GSS</label>
 <br>

 </div>

 <div id="itemss">
  <input name="checkall" type="checkbox" onclick="SetAllCheckBoxes('SelectedItemss','itemss');"><br>
 <form name="SelectedItemss" action="" method="post">
 <b>Select/Unselect All</b><br>


 <input id="idGSSmodules" type="checkbox" name="GSS" >
 <label for="idmodules">GSS</label><br>
 <input type="checkbox" name="GTS" id="idGSSmodules">
 <label for="idmodules">GSS</label>
 <br>

 </div>

 </form>

 </body>
 </html>

修改* * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** * ** *

如何在表单SetAllCheckBoxes（FormName，AreaID）上调用该方法;换句话说，我想使用复选框调用函数吗？

试过这个，但后来我无法更改复选框的值

 function unCheckBoxes(FormName, AreaID) {
     if(!document.forms[FormName])
     return;
     var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
     if(!objCheckBoxes)
     return;
     var countCheckBoxes = objCheckBoxes.length;

     for(var i = 0; i < countCheckBoxes; i++)
     objCheckBoxes[i].checked = false;
 }
 function checkCheckBoxes(FormName, AreaID){
     if(!document.forms[FormName])
     return;
     var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
     if(!objCheckBoxes)
     return;
     var countCheckBoxes = objCheckBoxes.length;


     for(var i = 0; i < countCheckBoxes; i++)
     objCheckBoxes[i].checked = true;
 }
checkCheckBoxes('locForm','locCheckboxes');

Answer 1

在输入元素复选框中，只有checked属性，使用此属性，页面上的所有复选框都将设置为您单击的复选框的相同值。

function setAllOtherCheckboxes(checkAllbox)
{
    var objCheckBoxes = document.getElementsByTagName('input');

    var chkBox = 0;
    for (chkBox in objCheckBoxes)
    {
        objCheckBoxes[chkBox].checked = checkAllbox.checked;            
    }       
}

并在您的代码中：

<input type="checkbox" name="All" value="on"" onclick="setAllOtherCheckboxes(this);">Alles<br>

Answer 2

您的两个复选框具有相同的id，这是真正的唯一标识符（不是name）。浏览器拒绝识别具有相同ID的两个对象。

将您的代码更改为：

<input id="GSS" type="checkbox" name="GSS">
<label for="GSS">GSS</label><br/>
<input type="checkbox" name="GTS" id="GTS">
<label for="GTS">GSS</label>

编辑：您还需要将第二组复选框重命名为唯一名称。页面上的每个id都必须是唯一的。

为什么第一个复选框工作但不是第二个？

2 个答案: