jQuery Checkbox 全选 反选的简单实例


Posted in Javascript onNovember 29, 2016

1.全选、反选

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script src="http://xiazai.3water.com/201611/yuanma/jquery(3water.com).rar"></script>
 <script type="text/javascript">
  $(function () {
   $("#selall").on("click", function () { $("#plalst :checkbox").prop("checked", true); });
   $("#selnone").on("click", function () { $("#plalst :checkbox").prop("checked", false); });
   $("#resver").on("click", function () { $("#plalst :checkbox").prop("checked", function (i, val) { return !val; }); });
   $("#chkAll").on("click", function () { $("#plalst :checkbox").prop("checked", $("#chkAll").prop("checked")) });

  });
 </script>
</head>
<body>
 <div id="plalst">
  <input type="checkbox" />一队
  <input type="checkbox" />二队
  <input type="checkbox" />三队
  <input type="checkbox" />四队
  <input type="checkbox" />五队
  <input type="checkbox" />六队
 </div>
 <br /><br /><br />
 <input type="button" id="selall" value="全选" />
 <input type="button" id="selnone" value="全不选" />
 <input type="button" id="resver" value="反选" />
 <input type="checkbox" id="chkAll" /><label for="chkAll" >选择</label>
</body>
</html>

以上就是本文的全部内容,希望对大家有所帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jQuery基础框架浅入剖析
Dec 27 Javascript
js截取中英文字符串、标点符号无乱码示例解读
Apr 17 Javascript
jquery得到iframe src属性值的方法
Sep 25 Javascript
jQuery实现文本框邮箱输入自动补全效果
Nov 17 Javascript
微信小程序 Toast自定义实例详解
Jan 20 Javascript
JavaScript实现父子dom同时绑定两个点击事件,一个用捕获,一个用冒泡时执行顺序的方法
Mar 30 Javascript
JavaScript实现简单的星星评分效果
May 18 Javascript
Javascript中Promise的四种常用方法总结
Jul 14 Javascript
jQuery实现标签子元素的添加和赋值方法
Feb 24 jQuery
Vue拖拽组件开发实例详解
May 11 Javascript
Vue.js 中的 v-model 指令及绑定表单元素的方法
Dec 03 Javascript
Vue项目中使用mock.js的完整步骤
Jan 12 Vue.js
使用Vue.js创建一个时间跟踪的单页应用
Nov 28 #Javascript
js拖拽功能实现代码解析
Nov 28 #Javascript
百度搜索框智能提示案例jsonp
Nov 28 #Javascript
JS函数多个参数默认值指定方法分析
Nov 28 #Javascript
ajax级联菜单实现方法实例分析
Nov 28 #Javascript
jQuery select自动选中功能实现方法分析
Nov 28 #Javascript
JS两种类型的表单提交方法实例分析
Nov 28 #Javascript
You might like
php中将一个对象保存到Session中的方法
2015/03/13 PHP
PHP抓取网页、解析HTML常用的方法总结
2015/07/01 PHP
PHP中filter函数校验数据的方法详解
2015/07/31 PHP
php获取给定日期相差天数的方法分析
2017/02/20 PHP
JavaScript中this关键字使用方法详解
2007/03/08 Javascript
js function使用心得
2010/05/10 Javascript
JS弹出对话框返回值代码(asp.net后台)
2010/12/28 Javascript
js判断页面中是否有指定控件的简单实例
2014/03/04 Javascript
jQuery中 prop() attr()使用详解
2015/05/19 Javascript
浅析Node.js中的内存泄漏问题
2015/06/23 Javascript
js实现索引图片切换效果
2015/11/21 Javascript
基于javascript实现彩票随机数生成(升级版)
2020/04/17 Javascript
深入学习jQuery Validate表单验证
2016/01/18 Javascript
JavaScript Promise 用法
2016/06/14 Javascript
nodejs+websocket实时聊天系统改进版
2017/05/18 NodeJs
解决nodejs的npm命令无反应的问题
2018/05/17 NodeJs
基于vue.js中关于下拉框的值默认及绑定问题
2018/08/22 Javascript
React优化子组件render的使用
2019/05/12 Javascript
nuxt 实现在其它js文件中使用store的方式
2020/11/05 Javascript
[43:32]Winstrike vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
python tensorflow学习之识别单张图片的实现的示例
2018/02/09 Python
vscode 配置 python3开发环境的方法
2019/09/19 Python
python如何调用字典的key
2020/05/25 Python
Python实现文件压缩和解压的示例代码
2020/08/12 Python
python Matplotlib数据可视化(2):详解三大容器对象与常用设置
2020/09/30 Python
基于OpenCV的路面质量检测的实现
2020/11/04 Python
西班牙Polo衫品牌:Polo Club
2020/08/09 全球购物
保险专业大专生求职信
2013/10/26 职场文书
诚信考试标语
2014/06/24 职场文书
员工试用期自我鉴定范文
2014/09/15 职场文书
2014年小学重阳节活动策划方案
2014/09/16 职场文书
CSS3通过var()和calc()函数实现动画特效
2021/03/30 HTML / CSS
css display table 自适应高度、宽度问题的解决
2021/05/07 HTML / CSS
Python连续赋值需要注意的一些问题
2021/06/03 Python
为什么MySQL分页用limit会越来越慢
2021/07/25 MySQL
python flappy bird小游戏分步实现流程
2022/02/15 Python