Javascript 未选中单选按钮时禁用复选框阵列

当对应的

单选按钮未选中时，我试图
禁用一个复选框数组。我的代码仅禁用
复选框
数组的第一个元素，而不禁用数组的其余元素。我可能做错了什么，但我似乎无法理解

任何帮助都可以

Javascript:

<script>
  function radioDisable(){
    if(document.getElementById('rdGrp').checked){
      document.getElementById('txtUserID[]').disabled=false;
    }else{
      document.getElementById('txtUserID[]').disabled=true;
    }
  }
</script>

<td>
  <input type="radio" name="rdAll" id="rdAll" value="all" onchange="radioDisable()"> All Users
  <br>
  <input type="radio" name="rdAll" id="rdGrp" value="group" onchange="radioDisable()"> Groups
  <br>
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="SysAd"> System Admin |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="faculty"> Faculty |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="student"> Student |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="registrar"> Registrar |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="adviser"> Adviser |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="clerk"> Clerk | 
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="management"> Management
</td>


函数radioDisable（）{
if（document.getElementById（'rdGrp'）。选中）{
document.getElementById（'txtUserID[]）。disabled=false；
}否则{
document.getElementById（'txtUserID[]）。disabled=true；
}
}

html:

<script>
  function radioDisable(){
    if(document.getElementById('rdGrp').checked){
      document.getElementById('txtUserID[]').disabled=false;
    }else{
      document.getElementById('txtUserID[]').disabled=true;
    }
  }
</script>

<td>
  <input type="radio" name="rdAll" id="rdAll" value="all" onchange="radioDisable()"> All Users
  <br>
  <input type="radio" name="rdAll" id="rdGrp" value="group" onchange="radioDisable()"> Groups
  <br>
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="SysAd"> System Admin |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="faculty"> Faculty |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="student"> Student |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="registrar"> Registrar |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="adviser"> Adviser |
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="clerk"> Clerk | 
  <input type="checkbox" name="txtUserID[]" id="txtUserID[]" value="management"> Management
</td>


所有用户


组


系统管理员|
教员|
学生|
登记员|
顾问|
秘书|
管理层
使用
getElementsByName

 function radioDisable(){
       var chkBoxes[] = document.getElementsByName('txtUserID[]');
       for (var i = 0; i < chkBoxes.length; i++) {
         if(document.getElementById('rdGrp').checked){
             chkBoxes[i].disabled=false;
           }
         else{
             chkBoxes[i].disabled=true;
         }
       }
    }

函数radioDisable（）{
var chkBoxes[]=document.getElementsByName（'txtUserID[]'）；
对于（变量i=0；i
使用
getElementsByName

 function radioDisable(){
       var chkBoxes[] = document.getElementsByName('txtUserID[]');
       for (var i = 0; i < chkBoxes.length; i++) {
         if(document.getElementById('rdGrp').checked){
             chkBoxes[i].disabled=false;
           }
         else{
             chkBoxes[i].disabled=true;
         }
       }
    }

函数radioDisable（）{
var chkBoxes[]=document.getElementsByName（'txtUserID[]'）；
对于（变量i=0；i

我的代码只禁用复选框数组的第一个元素，而不禁用数组的其余元素

因为
id
在同一个文档中应该是唯一的，如果有多个元素具有相同的
id
则只选择第一个元素，您可以使用name

使用获取所有复选框并循环通过它们禁用/启用每个复选框：

function radioDisable(){
    var checkboxes = document.getElementsByName('txtUserID[]');
    var disabled = !document.getElementById('rdGrp').checked;

    for(var i=0;i<checkboxes.length;i++){
          checkboxes[i].disabled = disabled;
    }
}

函数radioDisable（）{
var复选框=document.getElementsByName（'txtUserID[]）；
var disabled=！document.getElementById（'rdGrp'）。已选中；
对于（var i=0；i
我的代码只禁用复选框数组的第一个元素，而不禁用数组的其余元素

因为
id
在同一个文档中应该是唯一的，如果有多个元素具有相同的
id
则只选择第一个元素，您可以使用name

使用获取所有复选框并循环通过它们禁用/启用每个复选框：

function radioDisable(){
    var checkboxes = document.getElementsByName('txtUserID[]');
    var disabled = !document.getElementById('rdGrp').checked;

    for(var i=0;i<checkboxes.length;i++){
          checkboxes[i].disabled = disabled;
    }
}

函数radioDisable（）{
var复选框=document.getElementsByName（'txtUserID[]）；
var disabled=！document.getElementById（'rdGrp'）。已选中；
对于（var i＝0；i），您已将所有输入分配给相同的ID“txtUsRID[]”，这是不允许的。如果您考虑使用jQuery，可以简单地将一个类分配给输入（允许使用同一个类多个时间，而不是ID）。
<input type="checkbox" class="myClass">

你已经把所有的输入都分配给了同样的ID“TXTUSERID[]”，这是不允许的。如果你考虑使用jQuery，你可以简单地给输入指定一个类（你可以使用同一个类多个时间，而不是ID）。
<input type="checkbox" class="myClass">

如果删除重复的id，则可以使用此

function disableCheckboxes(){
    var chklist = document.getElementsByName('txtUserID[]');
    var chk = !document.getElementById('rdGrp').checked;
    for(var i=0;i<chklist.length;i++){
        chklist[i].disabled=chk;
    }
}

功能禁用复选框（）{
var chklist=document.getElementsByName（'txtUserID[]）；
var chk=！document.getElementById（'rdGrp'）。选中；
对于（var i=0；i如果删除重复的id，则可以使用此

function disableCheckboxes(){
    var chklist = document.getElementsByName('txtUserID[]');
    var chk = !document.getElementById('rdGrp').checked;
    for(var i=0;i<chklist.length;i++){
        chklist[i].disabled=chk;
    }
}

功能禁用复选框（）{
var chklist=document.getElementsByName（'txtUserID[]）；
var chk=！document.getElementById（'rdGrp'）。选中；
对于（var i=0；i从复选框中删除ID并添加class=“txtoserid”。然后像下面那样更新您的函数

function radioDisable(){ 
  if(this.checked){   
    var allChkBox = document.getElementsByName('txtUserID[]');
    for(var i =0, len = allChkBox.length; i < len; i++) {
       allChkBox[i].disabled = this.checked;
    }      
  }
}

函数radioDisable（）{
如果（这个.勾选）{
var allChkBox=document.getElementsByName（'txtUserID[]）；
对于（变量i=0，len=allChkBox.length；i
从复选框中删除ID并添加class=“txtUserID”。然后像下面那样更新您的函数

function radioDisable(){ 
  if(this.checked){   
    var allChkBox = document.getElementsByName('txtUserID[]');
    for(var i =0, len = allChkBox.length; i < len; i++) {
       allChkBox[i].disabled = this.checked;
    }      
  }
}

函数radioDisable（）{
如果（这个.勾选）{
var allChkBox=document.getElementsByName（'txtUserID[]）；
对于（变量i=0，len=allChkBox.length；i
在HTML中，每个元素都需要有一个唯一id，因此您的所有复选框元素上不应该有相同的id。getElementById将只返回一个元素，因为它希望id是唯一的，只有第一个复选框将被禁用

我建议您对所有这些复选框进行分类：

<input type="checkbox" name="txtUserID[]" class="example" value="SysAd">



然后使用

var disableUser=！document.getElementById（'rdGrp'）。已选中；
var x=document.getElementsByClassName（“示例”）；
对于（变量i=0；i

唯一：两个元素不能具有彼此相同的id。
每个元素需要在HTML中具有一个唯一id，因此您不应该在所有复选框元素上具有相同的id。getElementById将只返回一个元素，因为它希望id是唯一的，只有第一个复选框将被禁用

我建议您对所有这些复选框进行分类：

<input type="checkbox" name="txtUserID[]" class="example" value="SysAd">



然后使用

var disableUser=！document.getElementById（'rdGrp'）。已选中；
var x=document.getElementsByClassName（“示例”）；
对于（变量i=0；i

唯一：两个元素不能具有彼此相同的id。
您犯了一个常见错误。您的“输入”具有相同的“id”。这是不对的，id应始终是唯一的。如果要访问Javascript中的元素，请使用：

var uniqueElemem = document.getElementById("txtUserID"); // returns only 1 element.

如果要访问所使用的一组图元，请执行以下操作：

// returns an array of all elements which have the class "txtUserGroup".
var groupElem = document.getElementsByClassName("txtUserGroup");

因此，您必须将HTML更改为类似于