使用javascript按值查找复选框

Question

我使用这个JavaScript来找到我需要的复选框并检查它们.

<script type="text/javascript">
function checkAll(c) {
    var chks = document.getElementsByName(c.name);
    for (var i = 0; i < chks.length; i++) {
        chks[i].checked = c.checked;
    }
}

但我不能再使用它,并想知道我是否可以通过它们的值名称找到它们,假设我有3个像这样呈现的复选框.

<input name="2" type="checkbox" value="chk2" onclick="checkAll(this)">
<input name="3" type="checkbox" value="chk2" onclick="checkAll(this)">
<input name="4" type="checkbox" value="chk3" onclick="checkAll(this)">

如果我然后检查其中一个复选框,其值为value ="chk2",则应检查它们中的两个,但是没有一个值等于chk3的复选框.这可能吗？

Answer 1

试试querySelectorAll:

var chks = document.querySelectorAll("input[type='checkbox'][value='chk2']");

不需要jQuery,纯粹的Vanilla JavaScript!

Answer 2

请考虑使用 jQuery 和这样的语句来检查所有值为“chk2”的复选框：

$("input:checkbox[value='chk2']").attr("checked", true);

编辑：更优雅的方法是使用 ViewModel。然后，您可以将复选框绑定到一个数据实体，只要基础数据的值发生变化，复选框就会被选中/取消选中。您可以使用 Knockout.js 来实现这一点，并且很容易实现（http://knockoutjs.com）