Jquery 全选反选实例代码


Posted in Javascript onNovember 19, 2015

本文给大家分享一段基于jQuery的全选、反选和不选功能的代码,适用于网页多选后需要进行批量操作的场景(如批量删除等)。文章结合实例,代码简洁,基本覆盖选项选择操作的方方面面,希望可以帮到有需要的WEB爱好者。

//全选 全不选

$('#checkAll').click(function () {
  //判断是否被选中
  var bischecked = $('#checkAll').is(':checked');
  var fruit = $('input[name="check"]');
  bischecked ? fruit.attr('checked', true) : fruit.attr('checked', false);
 });

//反选   遍历checkbox 如果当前为选中 就设置为 不选中 反之相同

$("#tabVouchList tr").each(function () {
  if ($("td:eq(0) input[name='check']", $(this)).is(':checked')) {
   $(this).attr('checked', false);
  } else {
   $(this).attr('checked', true);
  }
 });

 HTML table

<table id="tabVouchList">
 <tr>
  <th>
   <input type="checkbox" name="checkAll" />
  </th>
  <th>
   行号
  </th>
  <th>
   名称
  </th>
 </tr>
 <tr>
  <td>
   <input type="checkbox" name="check" />
  </td>
  <td>
   行号
  </td>
  <td>
   名称
  </td>
 </tr>
</table>

以上代码就是jquery实现全选全不选反选的全部代码,代码是不是很简单啊,希望对大家工作学习有所帮助。

Javascript 相关文章推荐
解决jQuery动态获取手机屏幕高和宽的问题
May 07 Javascript
js+ajax实现获取文件大小的方法
Dec 08 Javascript
谈一谈js中的执行环境及作用域
Mar 30 Javascript
BootStrap Table复选框默认选中功能的实现代码(从数据库获取到对应的状态进行判断是否为选中状态)
Jul 11 Javascript
jQuery实现的文字逐行向上间歇滚动效果示例
Sep 06 jQuery
JavaScript正则表达式和级联效果
Sep 14 Javascript
使用ajax的post同步执行(实现方法)
Dec 21 Javascript
React Native使用fetch实现图片上传的示例代码
Mar 07 Javascript
vue的token刷新处理的方法
Jul 17 Javascript
Element Dialog对话框的使用示例
Jul 26 Javascript
element-ui和vue表单(对话框)验证提示语(残留)清除操作
Sep 11 Javascript
JS canvas实现画板和签字板功能
Feb 23 Javascript
Bootstrap每天必学之前端开发框架
Nov 19 #Javascript
Node.js中使用socket创建私聊和公聊聊天室
Nov 19 #Javascript
Jquery实现仿京东商城省市联动菜单
Nov 19 #Javascript
javascript实现二级级联菜单的简单制作
Nov 19 #Javascript
jquery通过扩展select控件实现支持enter或focus选择的方法
Nov 19 #Javascript
javascript中checkbox使用方法实例演示
Nov 19 #Javascript
jquery实现表格隔行换色效果
Nov 19 #Javascript
You might like
单位速度在实战中的运用
2020/03/04 星际争霸
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
?生?D片??C字串
2006/12/06 PHP
php htmlspecialchars()与shtmlspecialchars()函数的深入分析
2013/06/05 PHP
php将服务端的文件读出来显示在web页面实例
2016/10/31 PHP
jquery获取下拉列表的值为null的解决方法
2011/03/18 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
Javascript封装DOMContentLoaded事件实例
2014/06/12 Javascript
JavaScript类型检测之typeof 和 instanceof 的缺陷与优化
2016/01/13 Javascript
jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
2016/05/10 Javascript
深入浅析JS Function()构造函数
2016/08/22 Javascript
打造自己的jQuery插件入门教程
2016/09/23 Javascript
详解JavaScript权威指南之对象
2016/09/27 Javascript
javascript编程实现栈的方法详解【经典数据结构】
2017/04/11 Javascript
Angular中的$watch、$watchGroup、$watchCollection
2017/06/25 Javascript
Vue2.X 通过AJAX动态更新数据
2018/07/17 Javascript
基于js实现逐步显示文字输出代码实例
2020/04/02 Javascript
打印出python 当前全局变量和入口参数的所有属性
2009/07/01 Python
Python中datetime模块参考手册
2017/01/13 Python
pandas系列之DataFrame 行列数据筛选实例
2018/04/12 Python
python3的输入方式及多组输入方法
2018/10/17 Python
解决Python下json.loads()中文字符出错的问题
2018/12/19 Python
Python字符串逆序的实现方法【一题多解】
2019/02/18 Python
python实现AES加密解密
2019/03/28 Python
详解python tkinter模块安装过程
2020/01/06 Python
Python如何操作docker redis过程解析
2020/08/10 Python
HTML5操作WebSQL数据库的实例代码
2017/08/26 HTML / CSS
索引覆盖(Index Covering)查询含义
2012/02/18 面试题
政治学求职信
2014/06/03 职场文书
主题党日活动总结
2014/07/08 职场文书
讲党性心得体会
2014/09/03 职场文书
查摆问题整改措施范文
2014/10/11 职场文书
2014幼儿园卫生保健工作总结
2014/12/05 职场文书
2015年国培研修感言
2015/08/01 职场文书
读《皮囊》有感:理解是对他人的最大的善举
2019/11/14 职场文书
redis配置文件中常用配置详解
2021/04/14 Redis