使用Javascript根据组中的值选中或取消选中复选框

Checking or unchecking a checkbox based on value in a group with Javascript

本文关键字：取消 复选框 使用 Javascript      更新时间：2023-09-26

我真的是Javascript的新手，对JQuery一无所知，所以我现在为我的新手身份道歉。

我有一组复选框（最多18个），它们具有相同的名称和类（无法改变这一事实）：

<input type="checkbox" name="elective_id[]" value="112" class="elective_id">
<input type="checkbox" name="elective_id[]" value="128" class="elective_id">
<input type="checkbox" name="elective_id[]" value="135" class="elective_id">
<input type="checkbox" name="elective_id[]" value="322" class="elective_id" onClick="checkSister(322);">
<input type="checkbox" name="elective_id[]" value="323" class="elective_id" onClick="checkSister(323);">

在该数组中，将有3对复选框，当它们的对被选中/未选中时，需要对它们的对应项进行检查/未选中。三对是320321&322323&345346.

如果选中了值为322的复选框，我如何自动选择该对？

function checkSister(brother) {
 if (brother=="322") {
  document.getElementById("322").checked = true;        
  document.getElementById("323").checked = true;
 } else if (brother=="322") {
  document.getElementById("322").checked = true;        
  document.getElementById("323").checked = true;
 }
}

我知道这是不对的，但还没有弄清楚如何选择正确的变量，更不用说取消选择了。

如果您能提供任何帮助，我们将不胜感激，Jim

使用querySelectorAll ，无需jquery即可轻松完成

document.querySelectorAll("input[type='checkbox'][value='112']")[0].checked=true;

或者您可以按名称和值进行查询，如下所示：

document.querySelectorAll("input[name='elective_id[]'][value='112']")[0].checked=false;

要将普通JavaScript转换为jQuery，

function checkSister(brother) {
    if (brother=="322") {
      $("#322").prop("checked") = true;        
      $("#323").prop("checked") = true;  
 } else if (brother=="322") {
      $("#322").prop("checked") = true;     
      $("#323").prop("checked") = true;  
     }
}
相关文章：