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 相关文章推荐
ExtJS GridPanel 根据条件改变字体颜色
Mar 08 Javascript
javascript整除实现代码
Nov 23 Javascript
jquery库或JS文件在eclipse下报错问题解决方法
Apr 17 Javascript
js判断浏览器版本以及浏览器内核的方法
Jan 20 Javascript
jQuery学习笔记之Ajax用法实例详解
Dec 01 Javascript
js阻止浏览器默认行为的简单实例
May 15 Javascript
js实现div模拟模态对话框展现URL内容
May 27 Javascript
jQuery获取与设置iframe高度的方法
Aug 01 Javascript
基于Vue的移动端图片裁剪组件功能
Nov 28 Javascript
vue实现nav导航栏的方法
Dec 13 Javascript
vuex的使用及持久化state的方式详解
Jan 23 Javascript
vue-cli axios请求方式及跨域处理问题
Mar 28 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常用ODBC函数集(详细)
2013/06/24 PHP
php smarty truncate UTF8乱码问题解决办法
2014/06/13 PHP
php防止sql注入之过滤分页参数实例
2014/11/03 PHP
Smarty中的注释和截断功能介绍
2015/04/09 PHP
php-fpm开启状态统计的方法详解
2017/06/23 PHP
xss文件页面内容读取(解决)
2010/11/28 Javascript
jquery选择器、属性设置用法经验总结
2013/09/08 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
浅析jquery如何判断滚动条滚到页面底部并执行事件
2016/04/29 Javascript
Bootstrap零基础学习第一课之模板
2016/07/18 Javascript
配置nodejs环境的方法
2017/05/13 NodeJs
node.js连接MongoDB数据库的2种方法教程
2017/05/17 Javascript
vuex state及mapState的基础用法详解
2018/04/19 Javascript
Vue 动态设置路由参数的案例分析
2018/04/24 Javascript
vue移动端轻量级的轮播组件实现代码
2018/07/12 Javascript
webpack实践之DLLPlugin 和 DLLReferencePlugin的使用教程
2019/06/10 Javascript
ant-design-vue 时间选择器赋值默认时间的操作
2020/10/27 Javascript
python切换hosts文件代码示例
2013/12/31 Python
使用pyecharts在jupyter notebook上绘图
2020/04/23 Python
python3获取当前文件的上一级目录实例
2018/04/26 Python
关于Python的一些学习总结
2018/05/25 Python
谈一谈基于python的面向对象编程基础
2019/05/21 Python
使用python采集Excel表中某一格数据
2020/05/14 Python
使用CSS3的appearance属性改变任何元素的浏览器默认风格
2012/12/24 HTML / CSS
美国高端婴童品牌:Hanna Andersson
2016/10/30 全球购物
办公室保洁员岗位职责
2013/12/02 职场文书
聘任书模板
2014/03/29 职场文书
班子四风对照检查材料
2014/08/21 职场文书
村创先争优活动总结
2014/08/28 职场文书
2014年质量工作总结
2014/11/22 职场文书
安全生产先进个人事迹材料
2014/12/30 职场文书
高中教师个人工作总结
2015/02/10 职场文书
公共场所卫生管理制度
2015/08/05 职场文书
导游词之海南天涯海角
2019/12/05 职场文书
一文搞懂MySQL索引页结构
2022/02/28 MySQL
MySQL索引失效场景及解决方案
2022/07/23 MySQL