您的位置:首页 > Web前端 > JQuery

jquery中checkbox选择和全选

2016-01-11 00:06 871 查看
/**
* 全选事件
* @param idList 存储id的数组
* @param _this 对象
* @param label 存放ids的标签
*/
function selectAll(idList,_this,label){
var boxs = $("input.select-single");//所有商品记录
//被选中
if(_this.prop("checked")){
boxs.prop("checked",true);//复选框全部选中
boxs.each(function(){
if($.inArray($(this).val(),idList) < 0){//idList中不包含当前id值,则加入
idList.push($(this).val());
}
});
}else{
//全部取消
boxs.prop("checked",false);//复选框全部取消选中
//从idList数组中删除当前id
boxs.each(function(){
var index = $.inArray($(this).val(),idList);
if(index >= 0){//idList中包含当前id值,则删除
idList.splice(index,1);
}
});
}
$(label).val(idList.join(","));//将当前选中的商品主键写入隐藏域gid中
}

/***
* 单选事件
*/
function selectSingle(idList,_this,label){
if(_this.prop("checked")){//单选选中时
if($.inArray(_this.val(),idList) < 0){//idList中不包含当前id值,则加入
idList.push(_this.val());
}
if(_this.parents("#list-table").find(".select-single").length == _this.parents("#list-table").find(".select-single:checked").length){
//所有复选框都选中时,将全选复选框置为选中状态
_this.parents("#list-table").find(".select-all").prop("checked",true);
}
}else{//单选复选框取消选中时
//从idList数组中删除当前id
var index = $.inArray(_this.val(),idList);
if(index >= 0){//idList中包含当前id值,则删除
idList.splice(index,1);
}
_this.parents("#list-table").find(".select-all").prop("checked",false);
}
$(label).val(idList.join(","));//将当前选中的商品主键写入隐藏域id中
}

//全选事件
$(".select-all").click(function(){
var _this = $(this);
selectAll(idList,_this,".inner-section .list-title #ids");
});
//单选事件
$(".select-single").click(function(){
var _this = $(this);
selectSingle(idList,_this,".inner-section .list-title #ids");
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: