位置: 编程技术 - 正文

jquery实现简单的全选和反选功能(jquery简单例子)

编辑:rootadmin

推荐整理分享jquery实现简单的全选和反选功能(jquery简单例子),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery教程chm,jquery实战,使用jquery实现的项目,jquery使用教程,jquery简单例子,用jquery,jquery简单例子,jquery简单例子,内容如对您有帮助,希望把文章链接给更多的朋友!

首先我们看个简单的实例

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

引入jquery库

构建HTML

一般从数据库读出来的列表都需要批量选中以便删除与编辑等,下面我们就来模拟下,实现复选框checkbox的全选与不选,先建立html

jQuery 代码

1、全选或全不选。当勾选全选按钮#selectAll旁边的复选框#all时,列表中的选项全部选中,反之取消勾选则列表中的选项全部为未选中状态。

jquery实现简单的全选和反选功能(jquery简单例子)

2、全选。当点击全选按钮#selectAll或者勾选全选按钮旁边的复选框#all时,列表中所有的选项都会被选中,包括全选旁边的复选框也是选中状态。

3、全不选。当点击全不选按钮#unSelect时,列表中所有的选项都是未选中状态,当然包括#all也是未选中状态。

4、反选。当点击反选按钮#reverse,列表中所有被选中的选项变为未选中状态,而所有未选中的选项变为已选中状态,当然也要注意#all的状态。

代码中遍历了选项列表,然后改变checked属性,最后调用函数allchk(),后面将介绍该函数。

5、获得选中的所有值。我们要跟后台程序交互就必须获取列表中所选项的值,我们通过遍历数组,将选中项的值存放在数组中,最后组成由逗号(,)隔开的字符串,开发者就可以通过获取这个字符串进行相应的操作了。

为了完善选中选项功能,我们在单击列表中某个选项时,如果勾选的项刚好满足全部选中的条件,则#all也要相应的变为选中状态,同样,如果事先所有的选项是选中状态时,当取消勾选某个选项时,那么#all也要相应的变为未选中状态。

函数allchk()就是用来检测全选框#all应该是选中状态还是未选中状态的,请看代码。

总结

jQuery操作复选框的选中和不选中状态非常简单,使用attr()来设置"checked"属性的值,true未选中,false为未选中,在整个全选、反选过程中注意处理全选复选框的选中状态,以及获取选中选项的值。以下我将所有jQuery代码整理在一起,供大家参考。

理解jquery事件冒泡 一、什么是jquery事件冒泡在很多教材或者手册都可能会涉及到事件冒泡的概念,老手来说这当然是最基本的概念,但往往对于初学者可能比较陌生或者

jQuery自动完成插件completer附源码下载 我们在表单输入的时候,如要输入邮箱之类,只需输入邮箱名前段,那么@后面的内容将自动补全,将常用的几个邮箱列出来,用户只需选择一下就可以

jQuery插件之jQuery.Form.js用法实例分析(附demo示例源码) 本文实例讲述了jQuery插件之jQuery.Form.js用法。分享给大家供大家参考,具体如下:一、jQuery.Form.js插件的作用是实现Ajax提交表单。方法:1.formSerilize()用

标签: jquery简单例子

本文链接地址:https://www.jiuchutong.com/biancheng/379251.html 转载请保留说明!

上一篇:基于jQuery实现点击弹出层实例代码(jquery点击方法)

下一篇:理解jquery事件冒泡(jquery事件的响应)

  • 退税怎么做账务处理,需要交什么税
  • 外省人员收入怎么查
  • 待认证进项税额是什么情况下用的
  • 合并报表会计未分配利润怎么填写?
  • 商贸公司收到的邮票怎么做账
  • 企业应收账款无论是否带息,在年末资产负债表中均应以
  • 盘盈的固定资产通过待处理财产损益科目核算
  • 超市里的摊位租金贵吗
  • 交易性金融资产借贷方向
  • 计提的工会经费怎么做账
  • 税务房屋租赁发票图片
  • 筹建期结转损益吗
  • 单位的收入是刷卡怎么做账
  • 科技公司出售市场价格
  • 营改增以前建筑税率
  • 增值税申报表第31栏为什么有数字
  • 成立一般纳税人公司有什么好处
  • 记账凭证汇总表和汇总记账凭证有什么区别
  • 冲抵货款销售返利会计分录怎么写?
  • 平均年限法如何计算
  • 中小企业划分标准
  • 员工福利没有发票
  • 城市垃圾处理项目
  • 佣金的规定方法有哪些
  • qq上的时间和手机不一样怎么办
  • 什么时候可以购买火车票
  • 差旅费津贴可以扣除吗
  • PHP mysql_result()函数使用方法
  • 中秋节福利产品清单
  • 夜晚的地球 (© NASA)
  • php保留两位小数的函数
  • 政府性基金和行政事业性收费区别
  • vue页面路由传参
  • failed to execute goal org.apache
  • 合并抵销
  • 增值税附加税必须交吗
  • 图文详解水的画法
  • 融资租入的机器设备属于什么科目
  • 填报的资产总额在季初和季末存在差异是什么意思
  • 增值税普通发票查询真伪
  • 中药饮片盘点误差范围
  • 小企业短期借款科目的贷方登记
  • 高速公路电子发票查询平台
  • 建筑企业提供建筑服务适用一般计税方法的,以取得
  • 汉诺塔问题动画演示
  • 帝国cms插件编写教程
  • 5月份工作重点
  • 冲销以前年度费用会计分录
  • 文件柜质量标准
  • 电子承兑转出需要授权吗
  • 小规模纳税人增值税申报表怎么填
  • 转让不动产增值税征收管理办法
  • 原材料用于在建工程进项税
  • 记账凭证的编制依据是审核无误的原始凭证
  • 员工个人负担的社保要交工会经费怎
  • 机票行程单改签费抵扣 税务局
  • 办税人员可以是开票员吗
  • 企业在非同一控制下的企业合并
  • 压缩sql数据库
  • mysql8.0创建函数
  • 使用u盘安装windows10电脑识别不出来
  • 注册表隐藏桌面图标
  • win2003注册表空间不足
  • 苹果电脑mac怎么卸载软件
  • win7系统安装软件权限设置
  • python生成器详解
  • 每天看30分钟手机可以吗
  • 定时软件有哪些
  • windows pytorch
  • 简略说明本岗位最高风险的防范措施和现场处置方案
  • jquery.validate 自定义验证方法及validate相关参数
  • unity基于什么语言
  • 常见的java数据类型有哪些
  • js获取url参数值的两种方式
  • 百旺开票人怎么把管理员改成人名
  • 增值税纳税申报时间
  • 郑州房产契税缴纳
  • 深圳各区海拔
  • 新疆都有哪些地貌
  • 新疆哪个城市最有发展前景
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设