Question

我有一个复选框列表，我希望每当选中select all时，都应检查所有复选框，如果未选中，则应取消选中下面的所有复选框。但此后我也想要如果没有按下select all那么应该获取并追加单个复选框的值。 Select All Toggle工作正常但个别复选框已停用。我希望在未按下select all时，应获取以下复选框的各个值。

$(document).ready(function() {
  $("input[type='checkbox']").click(function() {
    if ($("#chk").is(':checked')) {
      $("input[type='checkbox']").prop('checked', true);

    } else if ($("#chk").not(':checked')) {
      $("input[type='checkbox']").prop('checked', false);


      $("input[type='checkbox']").click(function() {
        $("input[type='checkbox']:checked").each(function() {
          alert($(this).append(this.value));

        })

      })

    }


  })


})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="chk" name="check">Select All<br>
<input type="checkbox" name="check[]" value="mango">Mango<br>
<input type="checkbox" name="check[]" value="cherry">Cherry<br>
<input type="checkbox" name="check[]" value="apple">Apple<br>

Answer 1

您的问题是您的选择，将$("input[type='checkbox']").click(function() {更改为$("#chk").click(function() {

$("#chk").click(function() {
  if ($(this).is(':checked')) {
    $("input[type='checkbox']").prop('checked', true);
  } else if ($(this).not(':checked')) {
    $("input[type='checkbox']").prop('checked', false);

  }
});

$("input[type='checkbox']:not('#chk')").click(function() {
  if ($(this).is(':checked')) {
    var val = $(this).val();
    console.log(val);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="chk" name="check">Select All<br>
<input type="checkbox" name="check[]" value="mango">Mango<br>
<input type="checkbox" name="check[]" value="cherry">Cherry<br>
<input type="checkbox" name="check[]" value="apple">Apple<br>
<div id="selected"></div>

复选框 - 选择所有切换，并为每个复选框提供单独的功能

1 个答案: