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

最新推荐文章于 2024-04-25 11:38:14 发布

qq_26676207

最新推荐文章于 2024-04-25 11:38:14 发布

阅读量786

点赞数

分类专栏： js 文章标签： js 复选框全选

本文链接：https://blog.csdn.net/qq_26676207/article/details/50673714

版权

js 专栏收录该内容

53 篇文章 2 订阅

订阅专栏

<!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 οnclick="checkAll('mm')">全选<br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="checkItem('All')"><br/>
<input type=checkbox name=mm οnclick="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>