关于checkbox的一些jquery操作

表单在前端开发中是经常会遇到的，其中自然也少不了checkbox复选框，对于复选框的操作无外乎有以下三种：全选，全不选，反选。下面零度逍遥就给大家分析分析。

一、checkbox全选

大家都知道选择checkbox的方式是给它加上属性checked:‘checked‘，所以用jquery的方式就可以写成这样：

$(‘input[type=button]‘).click(function(){
    $(‘input[type=checkbox]‘).attr(‘checked‘,‘checked‘);
})

这样点击按钮就是一个全选的操作，但其实不知道大家知道不，checkbox的这样添加属性并不是w3c所推荐的，翻看她官网的推荐，checked的属性值是一个布尔值，所以上述设置checkbox的属性checked应该为true，代码如下：.

$(‘input[type=button]‘).click(function(){ $(‘input[type=checkbox]‘).attr(‘checked‘,true);
})

二、checkbox全不选

同全选，全不选刚好相反，可以这样写：

$(‘input[type=button]‘).click(function(){
    $(‘input[type=checkbox]‘).removeattr(‘checked‘);
})

同理，最好还是写成这样：

$(‘input[type=button]‘).click(function(){ $(‘input[type=checkbox]‘).attr(‘checked‘,false); })

三、checkbox反选

反选的逻辑就是把选中状态的变成非选中状态，把非选中状态的变成选中状态，通过上面我们可以知道checked的值是个布尔值，这样我们就能拿过来进行判断，所以代码可以写成：

$(‘input[type=button]‘).click(function(){
    $(‘input[type=checkbox]‘).attr(‘checked‘,!$(this).attr(‘checked‘));
})

这样就可以达成目的，不过这里要提到的一点是，在1.10.x的jquery中可能会无法实现上述功能，这时你需要加载个其他版本的jquery，这应该是jquery的一个小bug，具体的各位可以去测试一下。

关于checkbox的一些jquery操作

原文：http://www.cnblogs.com/lingdublog/p/6495638.html