jQuery 实现简单全选、全不选、反选

原创 2015年07月08日 09:17:50

jQuery 实现简单全选、全不选、反选


<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>全选、全不选、反选</title>
	<style>
	</style>
</head>
<body>
	<div id="checkbox">
		<input type="checkbox">吃
		<input type="checkbox">喝
		<input type="checkbox">玩
		<input type="checkbox">乐
	</div>
	<div id="btn">
		<input type="button">全选
		<input type="button">全不选
		<input type="button">反选
	</div>


<script src="http://libs.baidu.com/jquery/1.7.0/jquery.js"></script>
<script>
	var checkAll = $('#btn>input').eq(0);
	var checkNone = $('#btn>input').eq(1);
	var checkReverse = $('#btn>input').eq(2);
	var checkbox = $('#checkbox>:checkbox');

	checkAll.click(function(){
		checkbox.attr('checked',true)
	})
	checkNone.click(function(){
		checkbox.attr('checked',false)
	})
	checkReverse.click(function(){
		checkbox.each(function(){
			$(this).attr('checked',!$(this).attr('checked'));
		});
	});
</script>
</body>
</html>
.....................................

版权声明:转载需注明出处

jQuery实现checkbox点击全选和取消全选

jQuery实现点击全选和取消全选 有时候需要实现点击按钮全选,再点击取消全选,类似下图: 具体怎么实现呢? 代码如下: $('input[name="selectall"]')....
  • u011637069
  • u011637069
  • 2016年05月01日 13:14
  • 10091

JQuery实现全选、全不选和反选功能

项目中需要做一个全选、全不选和反选的功能。刚接到这个需求的时候,心想很简单的一个功能,几行代码就能搞定,然而事实并非如此。下面就把我的思路说一下: 1、当点击'全选'按钮时,页面中所有的复选框都应...
  • oXinLiang12
  • oXinLiang12
  • 2016年12月12日 16:01
  • 4109

Web小练习-复选框的全选以及反选效果

一个Web的小练习代码如下
  • Oliver_W
  • Oliver_W
  • 2017年07月12日 20:38
  • 204

jquery实现全选和全不选功能

无标题文档     $(document).ready(function () {         $("#checkedAll").click(function () {       ...
  • haibo0668
  • haibo0668
  • 2016年09月13日 15:45
  • 2281

利用Knockout+typescript双向绑定实现多ckeckbox选择

有时候多ckeckbox有点烦。多个T/F值搞的人蛋疼。所以换个思路。直接存值! 首先在你的Model中添加observable属用来存取值 let POCOValue:koobserva...
  • EMISRY
  • EMISRY
  • 2016年11月11日 06:44
  • 1009

typescript获取input值

做类型转换,如: var veritoken = (document.getElementsByName('__RequestVerificationToken')[0] as HTMLInputEl...
  • Tidecony
  • Tidecony
  • 2017年12月29日 15:25
  • 116

JavaScript中的枚举类型

var Color = []; Color[Color["Red"] = 0] = "Red"; Color[Color["Green"] = 1] = "Green"; Color[Color["B...
  • jinyuanyue
  • jinyuanyue
  • 2015年08月01日 14:31
  • 95

jquery全选,jquery全不选,jquery反选

全选,不全选,反选 $(function () { $("#selectAll").click(function () {//全选 ...
  • hexytxl
  • hexytxl
  • 2011年08月26日 10:40
  • 62157

jQuery实现表单全选、全不选以及反选的功能

本文主要介绍了利用jQuery实现表单的全选、全不选以及反选的功能。对如下的form表单: 请选择想要学习的编程语言: ...
  • github_38383183
  • github_38383183
  • 2017年06月22日 20:07
  • 782

用Jquery实现checkbox的反选、全选、全不选

当我们在用JS来实现web端操作的时候,多选框的全选、全不选和反选是最常用的功能,尤其是当数据量大的时候就需要这样的批量操作来给用户带来方便、快捷的服务了。        下面我们就来用JQuery...
  • yhc0322
  • yhc0322
  • 2011年09月18日 12:06
  • 35709
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jQuery 实现简单全选、全不选、反选
举报原因:
原因补充:

(最多只允许输入30个字)