Jquery : jquery实现checkbox的全选和反选

最新推荐文章于 2024-05-16 16:53:58 发布

歌歌的前端学习之路

最新推荐文章于 2024-05-16 16:53:58 发布

阅读量398

点赞数

分类专栏： jquery 前端

本文链接：https://blog.csdn.net/webEvelement/article/details/88837822

版权

jquery 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

前端

2 篇文章 0 订阅

订阅专栏

html:

	<body>
		name:<input type="checkbox"  name="name"/><br />
		name:<input type="checkbox"  name="name"/><br />
		name:<input type="checkbox"  name="name"/><br />
		name:<input type="checkbox"  name="name"/><br />
		name:<input type="checkbox"  name="name"/><br />
		name:<input type="checkbox"  name="name"/><br />
		<button>全选</button>
		<button>全不选</button>
		<button>反选</button>
	</body>

jquery

<script src="js/jquery-3.1.1.js"></script>
<script>
	$(function(){
		$("button:eq(0)").click(function(){
			$("input[type=checkbox]").each(function(index,item){
				$(item).prop("checked","checked");
			})
		})
		$("button:eq(1)").click(function(){
			$("input[type=checkbox]").each(function(index,item){
				$(item).prop("checked",false);
			})
		})
		$("button:eq(2)").click(function(){
			$("input[type=checkbox]").each(function(index,item){
				if(item.checked){
					$(item).prop("checked",false);
				}else{
					$(item).prop("checked","checked");
				}
			})
		})
	})
</script>

歌歌的前端学习之路

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery : jquery实现checkbox的全选和反选

html: <body> name:<input type="checkbox" name="name"/><br /> name:<input type="checkbox" name="name"/><br /> name:<input type="checkbox" name="name"/><...
复制链接

扫一扫

专栏目录