<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选,全不选,反选</title>
<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
<script>
$(function() {
// 全选
$("#allCheck").click(function(){
$(":checkbox").prop("checked",true);
});
// 全不选
$("#noCheck").click(function(){
$(":checkbox").prop("checked",false);
});
// 反选
$("#revCheck").click(function(){
// 给每一个多选框重新设定checked属性值,将其值设为原来值 相反
$(":checkbox").each(function(){
var check = $(this).prop("checked");
$(this).prop("checked",!check);
});
});
});
</script>
</head>
<body>
<input type="button" id="allCheck" value="全选"/>
<input type="button" id="noCheck" value="全不选"/>
<input type="button" id="revCheck" value="反选"/>
<br/>
<input type="checkbox"/>篮球<br />
<input type="checkbox"/>足球<br />
<input type="checkbox"/>羽毛球<br />
<input type="checkbox"/>乒乓球<br />
</body>
</html>
jQuery实现多选框的全选,全不选,反选
于 2018-07-26 15:31:16 首次发布