checkbox问题

checkbox多选事件：

如下HTML代码：

<input type="checkbox" name="test" value="1">1
<input type="checkbox" name="test" value="2">2
<input type="checkbox" name="test" value="3">3
<input type="checkbox" name="test" value="4">4
<input type="checkbox" name="test" value="5">5
<button id="btn_send" >点击改变选中状态</button>

点击全选中：

$("#btn_send").click(function(){
　　$("[name:test]:checkbox").attr("checked",false);
})

点击全部选中：

$("#btn_send").click(function(){
　　$("[name:test]:checkbox").attr("checked",false);
})

反选：关键在于!$(this).attr("checked");即与当前选中的状态不同

$("#btn_send").click(function(){
　　$("[name:test]:checkbox").each(function(){
　　　　$(this).attr("checked",!$(this).attr("checked"));
　　})
})

 也可以直接取checkbox的属性this.checked来实现：

$("#btn_send").click(function(){
　　$("[name:test]:checked").each(function(){
　　　　this.checked = !this.checked;
　　})
})

 

获取checkbox的值：

一、遍历选中的checkbox，获取值的字符串形式：

$("#btn_send").click(function(){
　　var str = "";
　　var value = $("[name:test]:checkbox:checked").each(function(){
　　　　str += $(this).val()+"\r\n";
　　});
　　//alert(str);
});

在项目后台中，获得primary_value的值。

$("#btn_send").click(function(){
　　var str = "";
　　//都可以实现，以下写法
　　//var value = $("[pk=user_id]:checkbox:checked").each(function(){
　　//var value = $("[pk:user_id]:checkbox:checked").each(function(){
　　var value = $(":checkbox:checked").each(function(){
　　　　str += $(this).val();
　　});
　　$("#user_id").val(str);//将值填充到指定的位置
});

 

 做全选与全部选的时候：

HTML：

<input type="checkbox" name="test" id="checkall_test">全选
<input type="checkbox" name="test" value="1">1
<input type="checkbox" name="test" value="2">2
<input type="checkbox" name="test" value="3">3
<input type="checkbox" name="test" value="4">4
<input type="checkbox" name="test" value="5">5
<button id="btn_send" >点击改变选中状态</button>

 

$("#checkall_test").click(function(){
　　if(this.checked){
　　　　$("[name=test]:checkbox").attr("checked",true);
　　}else{
　　　　$("[name=test]:checkbox").attr("checked",false);
　　}
})

因为所有子多选框的状态和checkall_test的状态是一样的所以可以这样写：

$("#checkall_test").click(function(){
　　$("[name=test]:checkbox").attr("checked",this.checked);
})

 

如果要实现全部选中的时候，checkall_test选中，如果有一个没选中则不选中checkall_test，如果都选中了自动选中checkall_test。实现如下：

$("[name=test]:checkbox").click(function(){
　　var flag = true;
　　$("[name=test]:checkbox").each(function(){
　　　　if(!this.checked){
　　　　　　flag = false;//如果有没选中的，则不选中checkall_test
　　　　}
　　});
　　$("#checkall_test").attr("checked",flag);
});

为什么在if中使用$(this).attr("checked",false)　　?? 

梗住了，那是设置属性了，这样改：$(this).attr("checked") == false就OK了！