<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>全选反选功能</title>
<meta charset="utf-8" />
<script src="Scripts/jquery-1.11.3.js"></script>
<script>
//文档就绪函数
$(function () {
//全选功能
$("#btn1").click(function () {
$("body :checkbox").prop("checked", true);
})
//反选功能
$("#btn2").click(function () {
$("body :checkbox").each(function () {
$(this).prop("checked", !$(this).prop("checked"));
});
allchk();
});
//全不选功能
$("#btn3").click(function () {
$("input[type='checkbox']").removeAttr("checked");
})
})
</script>
</head>
<body>
<!--按钮选项-->
<input type="checkbox" id="cbx1" value="1" />LOL<br />
<input type="checkbox" id="cbx1" value="2" />地下城<br />
<input type="checkbox" id="cbx1" value="3" />堡垒之夜<br />
<input type="checkbox" id="cbx1" value="4" />吃鸡<br />
<input type="checkbox" id="cbx1" value="5" />世界杯<br />
<hr />
<!--选项按钮-->
<input id="btn1" type="button" value="全选" />
<input id="btn2" type="button" value="反选" />
<input id="btn3" type="button" value="全不选" />
</body>
</html>
jQuery-全选反选全不选功能
猜你喜欢
转载自blog.csdn.net/cool__king/article/details/80806675
今日推荐
周排行