checkbox在jquery版本1.9 以上用attr不可重复操作的问题

第一次点“全选时”可以选中，再点“全不选”也正常取消选中，然后再点“全选”时发现操作没效果了。通过attr("checked")读取可以获得checked的内容，可见复选框的值已经是正确了，但是实际页面却不能正常显示。之前用的是1.10.1的版本，但是切换回1.8.3的可以反复点击,最后确定 从1.9.1开始到最新都无法正常显示。

<form>
    你爱好的运动是？<input type="checkbox" id="checkedAll2" />全选/全不选<br/>
    <input type="checkbox" name="items" value="足球"/>足球
    <input type="checkbox" name="items" value="篮球"/>篮球
    <input type="checkbox" name="items" value="羽毛球"/>羽毛球
    <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/>
    <input type="button" id="send" value="提　交"/>
</form>
<script>
    
//  全选/全不选
$('#checkedAll2').click(function(){
    $('[name=items]:checkbox').a't't('checked',this.checked);
});

//当已有一个没有被选中是全选按钮不被选中
$('[name=items]:checkbox').click(function(){
    var flag=true;
    $('[name=items]:checkbox').each(function(){
        if(!this.checked){
            flag=false;
        }
    });

   $('#checkedAll2').attr('checked',flag);
});

//输出值
$("#send").click(function(){
    var str="你选中的是：\r\n";
    $('[name=items]:checkbox:checked').each(function(){
        str+=$(this).val()+"\r\n";
    })
    alert(str);
});
</script>

解决方案：

//  全选/全不选	attr改成prop
$("#checkedAll2").click(function(){
   $('[name=items]:checkbox').prop('checked',this.checked);
});

$('#checkedAll2').prop('checked',flag);

.prop()方法是一种简便的设置值得方式，特别是多属性、使用函数返回值或者一次性在多个elements中设置数值。在设置selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 或者defaultSelected时应该使用本方法。从jQuery1.6起，这些属性不再能够用.attr()方法设置了，它们没有相当的attributes，只有properties。




Properties可以改变DOM元素的动态站台，不适用序列化的attribue。比如input的value属性、input和button的disabled属性，或者checkbox的checked属性。这时应该使用.prop()来替代.attr()来设置disabled和checked。.val()用于获取或者设置其value值。