jquery attr('checked','checked') 只工作一次

Question

我无法找到以下 jquery/checkbox 行为的原因。

$( this.obj + ' table.sgrid-content > thead > tr > th > input.select_all' ).on( 'click' , {grid:this} , function(event){

var grid = event.data.grid;

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

    $( grid.obj + ' table.sgrid-content > tbody > tr > td > input.select ' ).attr('checked','checked');
    $( grid.obj + ' .sgrid-content > tbody > tr > td > input.select ' ).parents('tr').addClass('ui-state-highlight');

} else {

    $( grid.obj + ' table.sgrid-content > tbody > tr > td > input.select ' ).removeAttr('checked');
    $( grid.obj + ' table.sgrid-content > tbody > tr > td > input.select ' ).parents('tr').removeClass('ui-state-highlight');

}

});

代码的工作原理如下： - 点击 input.select_all 触发事件 - 如果 input.select_all 被选中：将选中的属性添加到 table.sgrid-content 中标记为 .select 的所有复选框 - 如果不是：从所有 input.select 项目中删除 'checked' 属性。

又一个简单的网格函数。它有效。奇怪的是，它只工作一次。我的意思是，您可以选择所有复选框并取消选择它们。之后，“全选”功能停止工作。

另一个奇怪的事情是，当我用 firebug 检查 dom 元素时，它们都变成了应有的 checked='checked' attr，但它们的显示和行为就像没有被检查过一样。

选择器可以正常工作。添加/删除 ui-state-highlight 的代码部分一直有效。

解释词： grid - 是我传递给 grid.obj 的对象（基本上是某个 div 的 ID）

请给我你的意见。

Answer 1

您可以更改属性，如果元素未被触及，这也会更改属性。一旦元素离开此初始状态，更改属性将不再影响属性。确切的行为可能因浏览器而异。

Instead of .attr('checked', 'cheked') use .prop('checked', true)

Answer 2

使用 prop('checked', true / false) 代替 removeAttr

$('input[name=foo]').prop('checked', true);
$('input[name=foo]').prop('checked', false);