javascript中CheckBox全选终极方案

在我们的程序开发中经常会要用到CheckBox的全选，通常情况下是在一些数据绑定控件中如Gridview等
下面以Repeater为例，在Repeater的header 和item中放入CheckBox控件。

<asp:Repeater ID="rptGroup" runat="server"> <HeaderTemplate> <table width="100%" cellspacing="1" ><tr> <td width="3%" align="center" > <input type="checkbox" id="chkAll" name="chkAll" value="checkbox"onclick="checkAll（"chkAll",this）;" /> </td> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td align="center" > <input type="checkbox" name="chkSelect" value="<%# Eval（"ID"） %>"onclick="checkAll（"chkAll",this）;"/></td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate></asp:Repeater>

下面就是js脚本了
checkAll方法是实现CheckBox的全选和取消全选的。

function checkAll（chkAllID, thisObj） {var chkAll = document.getElementById（chkAllID）;var chks = document.getElementsByTagName（"input"）;var chkNo = 0;var selectNo = 0;for （var i = 0; i < chks.length; i++） {if （chks[i].type == "checkbox"） {//全选触发事件if （chkAll == thisObj） {chks[i].checked = thisObj.checked;}//非全选触发 else {if （chks[i].checked && chks[i].id ！= chkAllID）selectNo++;}if （chks[i].id ！= chkAllID） {chkNo++;}}}if （chkAll ！= thisObj） {chkAll.checked = chkNo == selectNo;}}

checkSelectNo 函数是用来获取所有checkbox 选中的个数这个在用来判断是否有勾选时非常有用。

function checkSelectNo（chkAllID） {var chks = document.getElementsByTagName（"input"）;var selectNo = 0;for （var i = 0; i < chks.length; i++） {if （chks[i].type == "checkbox"） {if （chks[i].id ！= chkAllID && chks[i].checked） {selectNo++;}}}return selectNo;}

以上所述就是本文的全部内容了，希望大家能够喜欢。