JQuery 多选按钮checkbox

时间:2024-01-07 12:26:08

JQuery 多选按钮checkbox

在需要全选和选择部分的时候我们就需要多选
在这里主要介绍了具体的实现

JQuery

$(function () {
//全选或全不选
$("#allbox").click(function(){
if(this.checked){
$(":checkbox").prop("checked",true);
}else{
$(":checkbox").prop("checked",false);
}
});
//设置全选复选框
$(":checkbox").click(function(){
allchk();
});
});
function allchk(){
var chknum = $(".item:checkbox").size();//选项总个数
var chk = $(".item:checkbox:checked").size();

if(chknum==chk){//全选
$("#allbox").attr("checked",true);
}else{//不全选
$("#allbox").attr("checked",false);
}
}

//获取选中的数据
var valArr = new Array;
$(".item:checkbox[checked]").each(function(i){
valArr[i] = $(this).val();
});
var vals = valArr.join(',');//vals就是checkbox的值,每个值以,隔开