前台js 2种 全选和不全选checkbox复选框

第一种：

<script type="text/javascript">
// 全选按钮选中标志
var checkflag = "false";
// 全选功能
function selectAll(name){
var field = document.getElementsByName(name);
// 如果全选按钮状态是未选中
if (checkflag == "false"){
for (i = 0; i < field.length; i++){
field[i].checked = true;
}
// 更改全选按钮选中标志
checkflag = "true";
}else{
for (i = 0; i < field.length; i++){
field[i].checked = false;
}
// 更改全选按钮选中标志
checkflag = "false";
}
}
</script>

html代码：

<form name="form" method="post" action="">

<input type="checkbox" value="全选" onClick="selectAll('list')">全选

<input type="checkbox" name="list" value="1" >1

<input type="checkbox" name="list" value="2" >2

<input type="checkbox" name="list" value="3" >3

<input type="checkbox" name="list" value="4" >4

</form>

第二种：

<script language ="javascript">
function CheckAll(form) {
for (var i=0;i<form.elements.length;i++)
{
var e = form.elements[i];
if (e.name != 'chkall') e.checked = form.chkall.checked;
}
}
</script>

html代码：

<form id="form1" runat="server" name="form1">
<input type="checkbox" name="chkall" onclick="CheckAll(this.form)" />全选
<input type="checkbox" />1
<input type="checkbox" />2
<input type="checkbox" />3
<input type="checkbox" />4
<input type="checkbox" />5
</form>