Question

我已经使用HTML文件中的脚本创建了多个复选框。我想根据以下条件使用名称来更新复选框。

Checkboxes[I].checked = true;

但是它抛出一个错误。您能否提出解决此问题的方法？

Answer 1

为此，我将尝试回答您，我有两个选择，按类或标记名，如果您想使用Jquery可能也很好。我为您准备了一个示例，希望此对您有帮助，问候

function toggleA() {
    var elm = document.getElementsByClassName('chx');
    
  for(var i = 0; i < elm.length; i++) {
      elm[i].checked = !elm[i].checked;
       // alert(elm[i].value);
  }
  
}

function toggleB() {
  var elm = $(".chx").prop("checked")
  
  $(".chx").prop( "checked", !elm ); 
}

function toggleC() {
    var elm = document.getElementsByTagName('input');
    
  for(var i = 0; i < elm.length; i++) {
    if(elm[i].type.toLowerCase() == 'checkbox') {
      elm[i].checked = !elm[i].checked;
       // alert(elm[i].value);
    }
  }
  
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btn" onclick="toggleA()">Toggle A</button>&nbsp;
<button id="btn" onclick="toggleB()">Toggle B</button>&nbsp;
<button id="btn" onclick="toggleC()">Toggle C</button>&nbsp;

<br><br>
<label>
    <input id="check-a" class = "chx" onchange="alert('Changed A!')" type="checkbox"> A
</label>
    <br><br>
<label>
    <input id="check-b" class = "chx" onchange="alert('Changed B!')" type="checkbox"> B
</label>
    <br><br>
<label>
    <input id="check-jq" class = "chx" onchange="alert('Changed JQ!')" type="checkbox"> JQ
</label>
    <br><br>
<label>
    <input id="check-c" class = "chx" onchange="alert('Changed C!')" type="checkbox"> C
</label>

关于更新多个复选框中的值

1 个答案: