0

我有一张表格，代表所有 CMS 帖子。我正在编写一个功能，允许通过单击“全选/取消全选”来选择/取消选择所有帖子checkbox element

例如，这将按预期工作 - 无论您点击多少次。如果复选框被选中 - 它会提示“Check All is checked now” 否则 - 它会提示“Check All is UNchecked now”

$("table thead input").click(function(){

 var checkboxes = $("table tbody tr input")

 if ($(this).is(':checked')) {

   alert('Check All is checked now');
 } else {

    alert('Check All is UNchecked now');
  }
 });

再次 - 它按预期工作。

但是，如果您将alert()s 替换为另一个逻辑，这将不再按预期工作，而只能工作一次。

$("table thead input").click(function(){

 var checkboxes = $("table tbody tr input")

  if ($(this).is(':checked')) {

  checkboxes.each(function(){   
    $(this).attr('checked', true);
  });

  } else {

    checkboxes.each(function(){

     $(this).attr('checked', false);
    });
  }
});

它会选中/取消选中这些复选框，但只会选中一次 - 如果您单击$("table thead input")更多次，它将不起作用。

我试过, toremoveAttr('checked')而不是$(this).attr('checked', false)，但没有运气。

有什么问题？

4

1 回答 1

1

使用.prop()而不是.attr()来设置检查状态

$(this).prop('checked', false);//to uncheck
$(this).prop('checked', true);//to check

属性与属性

您的代码可以简化为

$("table thead input").change(function () {
    var checkboxes = $("table tbody tr input");
    checkboxes.prop('checked', this.checked)
});

或者如果元素不是动态的，则在下面

//cache the checkbox reference
var checkboxes = $("table tbody tr input");
$("table thead input").change(function () {
    checkboxes.prop('checked', this.checked)
});
于 2013-10-04T06:27:00.720 回答