jQuery实现checkbox全选的方法


Posted in Javascript onJune 10, 2015

本文实例讲述了jQuery实现checkbox全选的方法。分享给大家供大家参考。具体分析如下:

通过checkbox 进行全选和取消全选的操作,如果通过toggle进行处理,则会出现checkbox无法显示对勾的问题。

使用click事件,根据checked属性进行判断即可。

示例:

$("#chkRreviewOffline").click(function(){ 
  if(this.checked){ 
    $('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
      this.checked=true; 
    }); 
  }else{ 
    $('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
      this.checked=false; 
    }); 
  } 
}); 
$('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
  $(this).click(function(){ 
    if(this.checked){ 
      //console.log('checked'); 
    }else{ 
      //console.log('not checked'); 
      $("#chkRreviewOffline").get(0).checked=false; 
    } 
  }); 
});

其中,下面的each()方法用于当页面其它的checkbox有未选中状态,则全选状态取消。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
在VS2008中使用jQuery智能感应的方法
Dec 30 Javascript
这些年、我收集的JQuery代码小结
Aug 01 Javascript
文本有关的样式和jQuery求对象的高宽问题分别说明
Aug 30 Javascript
javascript右下角弹层及自动隐藏(自己编写)
Nov 20 Javascript
jquery实现翻动fadeIn显示的方法
Mar 05 Javascript
个人总结的一些JavaScript技巧、实用函数、简洁方法、编程细节
Jun 10 Javascript
AngularJS 最常用的功能汇总
Feb 17 Javascript
node.js的exports、module.exports与ES6的export、export default深入详解
Oct 26 Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
Mar 13 Javascript
详解js模板引擎art template数组渲染的方法
Oct 09 Javascript
vue实现循环切换动画
Oct 17 Javascript
vue cli4中mockjs在dev环境和build环境的配置详情
Apr 06 Vue.js
JavaScript中的getTime()方法使用详解
Jun 10 #Javascript
简介JavaScript中的getSeconds()方法的使用
Jun 10 #Javascript
在JavaScript中操作时间之getMonth()方法的使用
Jun 10 #Javascript
在JavaScript中用getMinutes()方法返回指定的分时刻
Jun 10 #Javascript
JavaScript中的getMilliseconds()方法使用详解
Jun 10 #Javascript
在JavaScript中处理时间之getHours()方法的使用
Jun 10 #Javascript
JavaScript中计算网页中某个元素的位置
Jun 10 #Javascript
You might like
zend Framework中的Layout(模块化得布局)详解
2013/06/28 PHP
mysql查找删除重复数据并只保留一条实例详解
2016/09/24 PHP
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
Javascript实现重力弹跳拖拽运动效果示例
2013/06/28 Javascript
jquery增加和删除元素的方法
2015/01/14 Javascript
轻量级javascript 框架Backbone使用指南
2015/07/24 Javascript
详解JavaScript的流程控制语句
2015/11/30 Javascript
Javascript基于AJAX回调函数传递参数实例分析
2015/12/15 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
2016/01/27 Javascript
一次$.getJSON不执行的简单记录
2016/07/19 Javascript
jQuery Ajax 实现在html页面实时显示用户登录状态
2016/12/30 Javascript
JavaScript正则表达式exec/g实现多次循环用法示例
2017/01/17 Javascript
jQuery Easyui Treegrid实现显示checkbox功能
2017/08/08 jQuery
js中bool值的转换及“&&”、“||”、 “!!”详解
2017/12/21 Javascript
详解如何在vue-cli中使用vuex
2018/08/07 Javascript
从源码里了解vue中的nextTick的使用
2018/11/22 Javascript
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
2019/04/10 jQuery
jQuery HTML css()方法与css类实例详解
2020/05/20 jQuery
JavaScript实现像雪花一样的Hexaflake分形
2020/07/07 Javascript
python分析网页上所有超链接的方法
2015/05/08 Python
python通过getopt模块如何获取执行的命令参数详解
2017/12/29 Python
Python使用ElementTree美化XML格式的操作
2020/03/06 Python
python中如何打包用户自定义模块
2020/09/23 Python
10款最佳Python开发工具推荐,每一款都是神器
2020/10/15 Python
canvas绘制树形结构可视图形的实现
2020/04/03 HTML / CSS
全天然狗零食:Best Bully Sticks
2016/09/22 全球购物
英国领先的NHS批准的在线药店:Pharmacy2U
2017/01/06 全球购物
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
服务员岗位职责
2014/01/29 职场文书
公司员工检讨书
2014/02/08 职场文书
学校安全教育月活动总结
2014/07/07 职场文书
五年级小学生评语
2014/12/26 职场文书
一年级语文教学随笔
2015/08/14 职场文书
五年级数学教学反思
2016/02/16 职场文书
导游词范文之颐和园/重庆/云台山
2019/09/10 职场文书
Win11怎么跳过联网验机 ?Win11跳过联网验机激活教程
2022/04/05 数码科技