Javascript 使用jQuery选中页面加载上的所有复选框

在页面加载时，使用jQuery如何自动选择特定div中的所有复选框

所做的一切都会起作用，但总体而言，最好使用

true

/

false

，因为这就是它们的标准化方式，下面是一些示例，说明为什么这是一个方便的习惯。例如：

$(function(){
    $('#thediv input:checkbox').attr('checked', 'checked');
});

$('#myDiv :checkbox').attr('checked', 'checked');
alert($('#myDiv :checkbox').attr('checked')); //this alerts true, not "checked"

$(function() {
    $('#myDiv :checkbox').attr('checked', true);
});

相反，要养成传递布尔值的习惯，布尔值更通用，例如：

$('#myDiv :checkbox').attr('checked', 'checked');
alert($('#myDiv :checkbox').attr('checked')); //this alerts true, not "checked"

$(function() {
    $('#myDiv :checkbox').attr('checked', true);
});

这在更简洁的代码中提供了更大的灵活性，例如，如果我们在顶部有一个“checkall”复选框，那会是什么样子

$('#checkAll').change(function() {
  if(this.checked) {
    $('#subTable :checkbox').attr('checked', 'checked');
  } else {
    $('#subTable :checkbox').removeAttr('checked', 'checked');
  }
});

现在我们必须引入一个新函数来完成这项工作。说句公道话。但是，如果您利用jQuery内部的规范化功能，您可以大大降低这一成本，如下所示：

$('#checkAll').change(function() {
  $('#subTable :checkbox').attr('checked', this.checked);
});

---

---

这只是在编写代码时要记住的一点，同样的规则适用于

.attr（'disabled'）

。还有其他一些领域也会发生规范化…可能事件是其中最广泛的，如果您好奇，它已经为您完成了，请使用它：）

人们似乎真的不知道如何在jQuery中实现这一点。如果没有复选框，选中复选框会更容易、更有效。下面使用jQuery的优势，即选择和迭代一系列节点，并结合复选框元素的无法简化的DOM

checked

属性：

$("#myDiv input:checkbox").each(function() {
    this.checked = true;
});

在这种情况下，完全删除jQuery并不难：

var div = document.getElementById("myDiv");
var inputs = div.getElementsByTagName("input");
for (var i = 0, len = inputs.length; i < len; ++i) {
    if (inputs[i].type == "checkbox") {
        inputs[i].checked = true;
    }
}

---

这是firefox v.17.01中的工作。还没有在其他浏览器上进行测试

//选择并选中加载时的复选框

$('#enable, #enable1, #enable2, #enable3').attr('checked', 'checked');

请参见示例：

---

我知道我在这方面的记录不好，但实际上，checkbox元素的

checked

属性是迄今为止最简单、最自然的使用方法。同样的情况也适用于禁用的

@Tim-以及正在使用的内容：）但是，在多个元素上设置属性并不容易，您必须手动执行
。为此，each（）
调用所有代码。您可以执行
。checked=trueeach（）
和
checked
属性：由于名为
attr（）
函数（通常设置属性，而不是属性），许多开发人员现在对一些非常简单的东西存在着不必要的困惑人们现在建议用多种不确定和曲折的方式来设置一个简单的布尔标志，这个标志已经存在了十五年，并且工作得很愉快。@Tim-我明白你的意思，但归根结底，
elem['checked']=true在上面的方法中。是的，有一些开销，我想这是一个偏好的问题…这是一个非常小的时间/CPU成本在任何情况下，我个人将采取更简洁的方法在这些情况下。如果出于某种原因，我有足够多的复选框来处理这个问题……而且我认为在这一点上存在表单问题，那么我会选择
。each（）
方法：）足够公平。你知道你在做什么，所以你有能力做出深思熟虑的选择。我正试图为那些可能不是这样的开发人员简化一些事情。我反对在这里使用
attr（）
，与其说是因为性能，不如说是因为使用了合适的工具。jQuery几乎单枪匹马造成的属性/属性混乱是不必要的，也是令人讨厌的。它延续了DOM很难实现的神话，因此我们都应该使用jQuery，而事实是，在这种情况下，jQuery本身使一项简单的任务变得更难。我知道这项任务很老了，但也许你可以帮助我。我有一个表单，我喜欢预先选择div中的所有复选框，但是在表单提交后，它应该显示所选的框（用户可能会取消选择框，现在所有框都被再次选中）