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 相关文章推荐
一个符号插入器 中用到的js代码
Sep 04 Javascript
JQuery通过AJAX从后台获取信息显示在表格上并支持行选中
Sep 15 Javascript
JavaScript统计网站访问次数的实现代码
Nov 18 Javascript
使用jQuery制作基础的Web图片轮播效果
Apr 22 Javascript
浅析JSONP技术原理及实现
Jun 08 Javascript
JS导出PDF插件的方法(支持中文、图片使用路径)
Jul 12 Javascript
Bootstrap路径导航与分页学习使用
Feb 08 Javascript
微信小程序开发图片拖拽实例详解
May 05 Javascript
JS获取本地地址及天气的方法实例小结
May 10 Javascript
了解JavaScript中let语句
May 30 Javascript
微信小程序的开发范式BeautyWe.js入门详解
Jul 10 Javascript
jQuery实现电梯导航模块
Dec 22 jQuery
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
mysql_fetch_assoc和mysql_fetch_row的功能加起来就是mysql_fetch_array
2007/01/15 PHP
由php if 想到的些问题
2008/03/22 PHP
PHP中ADODB类详解
2008/03/25 PHP
JS实现php的伪分页
2008/05/25 PHP
php中curl、fsocket、file_get_content三个函数的使用比较
2014/05/09 PHP
php ci框架中加载css和js文件失败的原因及解决方法
2014/07/29 PHP
9个经典的PHP代码片段分享
2014/12/18 PHP
php实现登陆模块功能示例
2016/10/20 PHP
Thinkphp5.0自动生成模块及目录的方法详解
2017/04/17 PHP
PHP实现简单日历类编写
2020/08/28 PHP
自写简单JS判断是否已经弹出页面
2010/10/20 Javascript
jquery蒙版控件实现代码
2010/12/08 Javascript
灵活应用js调试技巧解决样式问题的步骤分享
2012/03/15 Javascript
JS刷新框架外页面七种实现代码
2013/02/18 Javascript
js限制checkbox选中个数以限制六个为例
2014/07/15 Javascript
Jquery 实现checkbox全选方法
2015/01/28 Javascript
JavaScript实现在标题栏上显示当前日期的方法
2015/03/19 Javascript
jQuery scrollFix滚动定位插件
2015/04/01 Javascript
JavaScript编写检测用户所使用的浏览器的代码示例
2016/05/05 Javascript
浅谈webpack下的AOP式无侵入注入
2017/11/12 Javascript
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
2018/05/10 Javascript
深入分析JavaScript 事件循环(Event Loop)
2020/06/19 Javascript
Vue props中Object和Array设置默认值操作
2020/07/30 Javascript
python ElementTree 基本读操作示例
2009/04/09 Python
微信跳一跳python辅助脚本(总结)
2018/01/11 Python
基于python if 判断选择结构的实例详解
2019/05/06 Python
python程序中的线程操作 concurrent模块使用详解
2019/09/23 Python
利用css3-animation实现逐帧动画效果
2016/03/10 HTML / CSS
加工操作管理制度
2014/01/19 职场文书
干部竞争上岗演讲稿
2014/09/11 职场文书
2014年十一国庆节活动方案
2014/09/16 职场文书
七年级地理教学计划
2015/01/22 职场文书
2015年乡镇平安建设工作总结
2015/05/13 职场文书
社区低保工作总结2015
2015/07/23 职场文书
浅谈Go语言多态的实现与interface使用
2021/06/16 Golang
vue实现input输入模糊查询的三种方式
2022/08/14 Vue.js