使用 Jquery 选中/取消选中输入框 [重复]

Question

我一直在寻找试图找到答案的帖子，但没有任何运气，所以希望有人能指出我正确的方向。

当我使用以下代码时，它会检查所有输入框并取消选中它们。但是，如果我再次单击全部检查，它不会全部检查。这是为什么呢？

JQuery

  $('document').ready( function() {
    $('.check_boxes').click( function() {
      if ( $(':checkbox').attr('checked')) {
        $(':checkbox').attr('checked', false);
      } else {
        $(':checkbox').attr('checked', true);
      }     
    });
});

HTML

<input type="checkbox" class="check_boxes" id="check_all" />

Answer 1

试试这个：

js

  $('document').ready( function() {
    $('.check_boxes').click( function() {
      if ( $('input:checkbox').prop('checked')) {
        $('input:checkbox').prop('checked', true);
      } else {
        $('input:checkbox').prop('checked', false);
      }     
    });
});

fiddle

Answer 2

实际上，一旦您单击复选框，第一个 if 始终为 true。因此，所有复选框都未选中（包括您单击的复选框）。

我假设你想要这种行为： http://jsfiddle.net/vhLMN/18/

$('document').ready( function() {
    $('.check_boxes').click( function() {
      if ( !this.checked ) {
        $('.flip_us :checkbox').attr('checked', false);
      } else {
        $('.flip_us :checkbox').attr('checked', true);
      };     
    });
});

顺便说一句。输入没有label 属性。你应该修复这个问题，除非你使用一些框架来创建实际的label tag。

Answer 3

我认为你需要这个简单的代码：

$('document').ready( function() {
$('.check_boxes').click( function() {
  if ( $(':checkbox').prop('checked')) {
    $(':checkbox').prop('checked', true);
  } else {
    $(':checkbox').prop('checked', false);
  }     
 });
});