jQuery无法以编程方式取消选中复选框

Question

简单的功能,我想根据更改顶级复选框切换检查/取消选中复选框.

问题是Toggle/Click事件处理程序存在固有问题.如果您尝试将这些处理程序绑定到输入复选框,则框的默认检查行为将失败.

所以,我尝试以两种不同的方式之一使用Change处理程序.

     $('input.all_neighborhoods').change(function(){
    if($(this).not(':checked')){
        $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').attr('checked','checked');
    }
    else{
        $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').removeAttr('checked');
    }

    });

在这里,第一个变化按照您的预期运作.选中并选中所有同级复选框.但是,当我再次单击取消选中时,没有任何反应.事件处理程序不起作用.

然后我尝试了这个:

   $('input.all_neighborhoods').change(function(){
    $(this).attr( 'checked', $(this).is( ':checked' ) ? $(this).closest('li').siblings('li').find('input[name=neighborhood_id]').attr('checked','checked'): $(this).removeAttr('checked').closest('li').siblings('li').find('input[name=neighborhood_id]').removeAttr('checked') );
}); 

在这里,兄弟复选框有效地切换.但是,主开/关开关复选框保持选中状态.

这里的问题是否与他们都是兄弟姐妹并且主要复选框不是父母这一事实有关？

Answer 1

(警告,无耻的自我推销).我写了一个jQuery插件,可以为你处理所有这些混乱.无需重新发明轮子.

看看:http://mjball.github.com/jQuery-CheckAll/

如果你想坚持使用当前的方法,这里是如何解决它:

$('input.all_neighborhoods').change(function() {
    $(this).closest('li')
        .siblings('li')
        .find('input[name=neighborhood_id]').attr('checked', this.checked);
}

只需传递一个布尔值即可.attr().另外,根据何时使用Vanilla JavaScript与jQuery？不要用

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

而是使用

this.checked

这是更少的字符写的,不需要任何jQuery的,并且是方式更有效.