用Jquery来实现全选/全不选，反选。

最新推荐文章于 2021-08-06 16:30:04 发布

Casset。

最新推荐文章于 2021-08-06 16:30:04 发布

阅读量371

点赞数

分类专栏：学习随记文章标签： jQuery 全选/全不选反选

本文链接：https://blog.youkuaiyun.com/weixin_44397434/article/details/102660411

版权

学习随记专栏收录该内容

13 篇文章

订阅专栏

本文介绍如何使用jQuery实现全选、全不选及反选功能，通过简单的代码示例，展示了如何控制一组复选框的状态。适用于前端开发者快速掌握jQuery在表单操作上的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jQuery代码

全选/全不选
- 反选

全选/全不选

$(function() {//全选和全不选
		$("#all").on("click",function() {//当我们点击按钮时
			if (this.checked==true) {//如果复选框是选中的
				$("input[name='id']").attr("checked","checked");//我们就让name=’id’的也选中
			}else {//如果复选框不是选中的
				$("input[name='id']").attr("checked",false);//我们就让name=”id”的也不选中
			}
	});

<form action="" method="post">
<input type="checkbox" id="all" />全选/全不选
</form>

这里是图片解释：
这是HTML和jQuery一起写的

反选

<form action="" method="post">
<input type="checkbox" id="fan"/>反选
</form>

<script>
	$("#fan").on("click",function(){ //反选   
			$("input[name='id']").each(function(){
				$(this).attr("checked", !$(this).attr("checked"));
			});
		});
</script>