jQuery实现复选框的全选和反选


Posted in Javascript onFebruary 02, 2017

话不多说,请看代码

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
</head>
<body>
 <form>
 <label for="apple">苹果</label>
 <input type="checkbox" name="apple">
 <label for="banana">香蕉</label>
 <input type="checkbox" name="banana">
 <label for="orange">橘子</label>
 <input type="checkbox" name="orange">
 <input type="button" value="全选" onclick="allPick()">
 <input type="button" value="全不选" onclick="unAllPick()">
 <input type="button" value="反转" onclick="inverserPick()">
 </form>
 <script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
 <script>
 // 全选
 function allPick() {
  $("[type=checkbox]:checkbox").each(function () {
  this.checked = true;
  })
 }
 // 全不选
 function unAllPick() {
  $("[type=checkbox]:checkbox").each(function () {
  this.checked = false;
  })
 }
 // 反转
 function inverserPick() {
  $("[type=checkbox]:checkbox").each(function () {
  this.checked = !this.checked;
  })
 }
 </script>
</body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
javascript编程起步(第一课)
Jan 10 Javascript
js动态创建表格,删除行列的小例子
Jul 20 Javascript
几种延迟加载JS代码的方法加快网页的访问速度
Oct 12 Javascript
jquery Tab效果和动态加载的简单实例
Dec 11 Javascript
文本框只能输入数字的js代码(含小数点)
Jul 10 Javascript
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
Nov 05 Javascript
详解AngularJS中$filter过滤器使用(自定义过滤器)
Feb 04 Javascript
zTree树形插件异步加载方法详解
Jun 14 Javascript
微信小程序页面滑动屏幕加载数据效果
Nov 16 Javascript
vue实现简单跑马灯效果
May 25 Javascript
js实现贪吃蛇小游戏(加墙)
Jul 31 Javascript
Java无向树分析 实现最小高度树
Apr 09 Javascript
jQuery制作图片旋转效果
Feb 02 #Javascript
浅谈javascript中的 “ &amp;&amp; ” 和 “ || ”
Feb 02 #Javascript
Javascript中的 “&amp;” 和 “|” 详解
Feb 02 #Javascript
javascript实现简易计算器
Feb 01 #Javascript
javascript实现右下角广告框效果
Feb 01 #Javascript
基于javascript实现最简单选项卡切换
Feb 01 #Javascript
快速实现jQuery多级菜单效果
Feb 01 #Javascript
You might like
PHP不用递归遍历目录下所有文件的代码
2014/07/04 PHP
php模拟post提交数据的方法
2015/02/12 PHP
mac系统下安装多个php并自由切换的方法详解
2017/04/21 PHP
PHP实现RSA签名生成订单功能【支付宝示例】
2017/06/06 PHP
PHP从尾到头打印链表实例讲解
2018/09/27 PHP
Ajax+Json 级联菜单实现代码
2009/10/27 Javascript
javascript实现的基于金山词霸网络翻译的代码
2010/01/15 Javascript
jqueyr判断checkbox组的选中(示例代码)
2013/11/08 Javascript
jQuery之ajax删除详解
2014/02/27 Javascript
javascript函数中参数传递问题示例探讨
2014/07/31 Javascript
Angularjs基础知识及示例汇总
2015/01/22 Javascript
使用jQuery mobile库检测url绝对地址和相对地址的方法
2015/12/04 Javascript
angular.js之路由的选择方法
2016/09/24 Javascript
javascript中活灵活现的Array对象详解
2016/11/30 Javascript
JS前端加密算法示例
2016/12/22 Javascript
详解ES6之用let声明变量以及let loop机制
2017/07/15 Javascript
JavaScript中附件预览功能实现详解(推荐)
2017/08/15 Javascript
用vue写一个仿简书的轮播图的示例代码
2018/03/13 Javascript
通过javascript实现段落的收缩与展开
2019/06/26 Javascript
[01:20:05]DOTA2-DPC中国联赛 正赛 Ehome vs VG BO3 第二场 2月5日
2021/03/11 DOTA
Python3中常用的处理时间和实现定时任务的方法的介绍
2015/04/07 Python
Python 移动光标位置的方法
2019/01/20 Python
在Ubuntu 20.04中安装Pycharm 2020.1的图文教程
2020/04/30 Python
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
面向中国市场的在线海淘美妆零售网站:Beauty House美丽屋
2021/03/02 全球购物
控制工程专业个人求职信
2013/09/25 职场文书
前台文员的岗位职责
2013/11/14 职场文书
写给女生的道歉信
2014/01/08 职场文书
学校招生宣传广告词
2014/03/19 职场文书
小学二年级学生评语
2014/04/21 职场文书
关于奉献的演讲稿
2014/05/21 职场文书
民主生活会对照检查材料(统计局)
2014/09/21 职场文书
通知格式
2015/04/27 职场文书
2015年高中生国庆节演讲稿
2015/07/30 职场文书
反邪教教育心得体会
2016/01/15 职场文书
MyBatis 动态SQL全面详解
2021/10/05 MySQL