功能描述:列表头部单个复选框按钮实现全选/全否功能。并且如果下面的列表中的复选框有一个没有选中,全选按钮为未选中状态;如果下面的列表中的复选框全部选中,全选按钮也为勾中状态!$(function () {
//全选按钮单击事件 按钮id为allCheck
$("#allCheck").bind("click", function () {
//得到全选按钮对象
var obj = $("#allCheck:checkbox");
//得到全选按钮当前的状态:选中or未选中
var checkFlag = obj.attr("checked");
//如果全选按钮选中,则下面的列表中的复选框全部勾中
if(checkFlag)
{
$("[name = selectUid]:checkbox").attr("checked", true);
}
//如果全选按钮未选中,则下面的列表中的复选框全部未选中
if(!checkFlag)
{
$("[name = selectUid]:checkbox").attr("checked", false);
}
});
//列表中复选框的单击事件 按钮name为selectUid
$("[name = selectUid]:checkbox").bind("click", function () {
//得到全选按钮
var checkAllObj = $("#allCheck:checkbox");
//得到列表中的复选框
var checkOneObj = $("[name = selectUid]:checkbox");
//迭代列表中的复选框 根据是否为全部选中来设置全选按钮的状态
for(var i=0; i < checkOneObj.length; i++)
{
var sonCheckFlag = $(this).attr("checked");
//列表中的复选框有任意一个未选中 全选按钮的状态改为未选中
if(!sonCheckFlag)
{
checkAllObj.attr("checked", false);
return;
}
}
//列表中的复选框被选中的个数
var count = 0;
for(var i=0; i < checkOneObj.length; i++)
{
var theOne = checkOneObj[i];
var sonCheckFlag = $(theOne).attr("checked");
if(sonCheckFlag)
{
count = count + 1;
}
}
//如果列表中的复选框被选中的个数与列表中的复选框的个数相等 设置全选按钮为选中状态
if(count == checkOneObj.length)
{
checkAllObj.attr("checked", true);
}
});
});全选,全否,复选框选中事件CheckBox
//全选按钮单击事件 按钮id为allCheck
$("#allCheck").bind("click", function () {
//得到全选按钮对象
var obj = $("#allCheck:checkbox");
//得到全选按钮当前的状态:选中or未选中
var checkFlag = obj.attr("checked");
//如果全选按钮选中,则下面的列表中的复选框全部勾中
if(checkFlag)
{
$("[name = selectUid]:checkbox").attr("checked", true);
}
//如果全选按钮未选中,则下面的列表中的复选框全部未选中
if(!checkFlag)
{
$("[name = selectUid]:checkbox").attr("checked", false);
}
});
//列表中复选框的单击事件 按钮name为selectUid
$("[name = selectUid]:checkbox").bind("click", function () {
//得到全选按钮
var checkAllObj = $("#allCheck:checkbox");
//得到列表中的复选框
var checkOneObj = $("[name = selectUid]:checkbox");
//迭代列表中的复选框 根据是否为全部选中来设置全选按钮的状态
for(var i=0; i < checkOneObj.length; i++)
{
var sonCheckFlag = $(this).attr("checked");
//列表中的复选框有任意一个未选中 全选按钮的状态改为未选中
if(!sonCheckFlag)
{
checkAllObj.attr("checked", false);
return;
}
}
//列表中的复选框被选中的个数
var count = 0;
for(var i=0; i < checkOneObj.length; i++)
{
var theOne = checkOneObj[i];
var sonCheckFlag = $(theOne).attr("checked");
if(sonCheckFlag)
{
count = count + 1;
}
}
//如果列表中的复选框被选中的个数与列表中的复选框的个数相等 设置全选按钮为选中状态
if(count == checkOneObj.length)
{
checkAllObj.attr("checked", true);
}
});
});全选,全否,复选框选中事件CheckBox
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货