JQuery:Checkbox如何在选中其他复选框时选中或取消选中所有复选框

当我选中/取消选中selectAll复选框时，我希望选中或取消选中所有其他复选框

没有子元素或父元素

Html代码：

<div>
 <li class="input">
  <input type="checkbox" name="selectAll" value=""></input>
 </li>
 <li class="input">
  <input type="checkbox" name="practice" value=""></input>
 </li>
 <li class="input">
  <input type="checkbox" name="filename" value=""></input>
 </li>
 <li class="input">
  <input type="checkbox" name="comment" value=""></input>
 </li>
</div>

及

HTML

<div>
    <li class="input">
        <input type="checkbox" class="select-all" name="selectAll" value=""></input>
    </li>
    <li class="input">
        <input type="checkbox" class="item-checkbox" name="practice" value=""></input>
    </li>
    <li class="input">
        <input type="checkbox" class="item-checkbox" name="filename" value=""></input>
    </li>
    <li class="input">
        <input type="checkbox" class="item-checkbox" name="comment" value=""></input>
    </li>
</div>

或者（如果由于某种原因无法分配类）

或者（如果您只需要DOM中处于类似级别的复选框）

$("input[name=selectAll]").on("click", function() {
    $(this).closest("div").find("input:checkbox").prop("checked", $(this).prop("checked"));
});

给你

标记：

  <div>
    <li class="input">
      <input type="checkbox" id="select-all" name="selectAll" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="practice" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="filename" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="comment" value=""/>
    </li>
  </div>

$("#select-all").on("click", function() {
  var all = $(this);
  $('input:checkbox').each(function() {
       $(this).prop("checked", all.prop("checked"));
  });
});

---

Fiddle：

我试过这样做-$（this）.sibbines（'ul'）.find（'input[type='checkbox']）.prop（'checked'，true）；问题是所有复选框都是同一级别的，没有父项和child@Atish你应该在问题中提到你到目前为止做了什么，而不是在评论中。事实上，我想勾选所有的复选框，而不仅仅是同一级别的复选框。你能给你想要一个类的复选框吗？这样会更容易找到它们。否则你必须按na进行选择我或键入。实际上，我无法为复选框赋予类，因为它们是动态创建的，而不是硬编码的html@Atish如果类是动态创建的，您也可以添加它们…@Atish正如giammin指出的，这与此处的其他问题/答案非常相似…您的问题更多地是关于一组特定的选择器r取消选中复选框相当简单。您只需为要选中的复选框找到正确的选择器。

$("input[name=selectAll]").on("click", function() {
    $("input:checkbox").prop("checked", $(this).prop("checked"));
});

$("input[name=selectAll]").on("click", function() {
    $(this).closest("div").find("input:checkbox").prop("checked", $(this).prop("checked"));
});

  <div>
    <li class="input">
      <input type="checkbox" id="select-all" name="selectAll" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="practice" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="filename" value=""/>
    </li>
    <li class="input">
      <input type="checkbox" name="comment" value=""/>
    </li>
  </div>

$("#select-all").on("click", function() {
  var all = $(this);
  $('input:checkbox').each(function() {
       $(this).prop("checked", all.prop("checked"));
  });
});