js点击复选框全选或全不选

来源：互联网发布：网络摄像头安全吗编辑：程序博客网时间：2024/05/17 04:41

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 复选框的全选，多选，全不选，反选 </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">


</HEAD>

<BODY>

<form name=hrong>
<input type=checkbox id="quanxuan"name=All onclick="checkAll('mm')">全选<br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/>
<input type=checkbox name=mm onclick="checkItem('All')"><br/><br/>




</form>

<SCRIPT LANGUAGE="JavaScript">
function checkAll(str)
{
var a = document.getElementsByName(str);
var n = a.length;
for (var i=0; i<n; i++)
a[i].checked = window.event.srcElement.checked;
}
function checkItem(str)
{
var e = window.event.srcElement;
var all = eval("document.all."+ str);
if (e.checked)
{
var a = document.getElementsByName(e.name);
all.checked = true;
for (var i=0; i<a.length; i++)
{
if (!a[i].checked)
{
all.checked = false; break;
}
}
}
else
all.checked = false;

}

jquery方法

$("#quanxuan").click(function(){$("[name=mm ]:checkbox").prop("checked",this.checked);});$("[name=mm ]:checkbox").click(function(){var flag=true;$("[name=mm ]:checkbox").each(function(){if(!this.checked){flag=false;}});$("#quanxuan").prop("checked",flag);});

</SCRIPT>

</BODY>
</HTML>

0 0