jQuery实现复选框的全选和全不选
2019-01-22 本文已影响0人
云鲸鱼rain
最近真是疯狂写js，作为一个java开发，在一个前后端不分离做系统的公司，用着bootstrap和freemarker，查着百度和问着前端同学。
从 https://blog.csdn.net/qq_40087415/article/details/79248592 处学习。
全选or不全选参考自以上链接。
该博主写的十分详细，拿过来记录一下，方便之后用的时候好找。
为了防止该博主删掉内容走掉，我复制一份过来...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery实现复选框的全选和全不选</title>
</head>
<body>
<label><input type="checkbox" name="checkall" />全选</label>
<br><br>
<label><input type="checkbox" name="checkbox" />复选框1</label>
<label><input type="checkbox" name="checkbox" />复选框2</label>
<label><input type="checkbox" name="checkbox" />复选框3</label>
<label><input type="checkbox" name="checkbox" />复选框4</label>
<label><input type="checkbox" name="checkbox" />复选框5</label>
<!-- 引入jQuery官方类库 -->
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<!-- start 全选/全不选 -->
<script type="text/javascript">
$('input[name="checkall"]').on("click",function(){
if($(this).is(':checked')){
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",true);
});
}else{
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",false);
});
}
});
</script>
<!-- end 全选/全不选 -->
</body>
</html>
---------------------
作者：Kevin_PB
来源：CSDN
原文：https://blog.csdn.net/qq_40087415/article/details/79248592
