位置: 编程技术 - 正文

jQuery实现checkbox即点即改批量删除及中间遇到的坑

编辑:rootadmin

推荐整理分享jQuery实现checkbox即点即改批量删除及中间遇到的坑,希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助,希望把文章链接给更多的朋友!

最近要用jQuery实现一个批量删除操作,效果如下图

最终页面page.html,此页面使用了bootstrap和jQuery,如果没有需要下载一下

上图的操作主要需要两个操作:

一、当checkBox点击时进行选中计数(带坑)。

二、当点击批量删除时,拼接选中单位的id,传递给个后台。

初看一下,感觉这些很好实现,并且实现的方法很多。当初我也是这么认为的,结果搞了一个上午.......,接下来就看看jQuery的一些坑。

我开始想法是每次点击checkBox时,对所有的checkBox进行each()遍历,如果是勾选状态就将Num++,最后将num的值赋给批量删除的数字小标签,顺便把id也拼接了。

当这段代码触发时,却发现一个诡异的现象:这段代码会在勾选效果前先触发。类似于beforeClick(),所以当代码遍历时,无法获取当前的勾选状态。

jQuery实现checkbox即点即改批量删除及中间遇到的坑

就这个问题,我在网上找了半天答案,硬是不知道如何解决,什么mouseup()都用了一下,都是beforeClick的效果。

最后我使用了另一种写法。

  成功运行出效果!

结论:

  在click()中使用input[type=[checkbox]:checked]选择器获得勾选元素时,得到的就是勾选后的结果afterclick()。

  而使用.each()遍历时,获取的是勾选前的效果beforeclick。

  为什么一个click函数里,能得出beforeclick和aferclick两种效果?

  坑哭......

总结

以上所述是小编给大家介绍的jQuery实现checkbox即点即改批量计数及中间遇到的坑,希望对大家有所帮助,如果大家有任何疑问欢迎各我留言,小编会及时回复大家的!

JQ图片文件上传之前预览功能的简单实例(分享) 1、先准备一个divonchange触发事件inputtype="file"onchange="preview(this)"/spandivid="preview"/div2、写JS代码//上传图片之前预览图片functionpreview(file){if(file.files&&file.files

jQuery除指定区域外点击任何地方隐藏DIV功能 具体代码如下所示:$('body').click(function(e){vartarget=$(e.target);//如果#overlay或者#btn下面还有子元素,可使用//!target.is('#btn*')&&!target.is('#overlay*')if(!target.is('#bt

前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来 做项目的时候有这么一个需求,客户信息显示出来后我要搜索查找相关的客户,并把相关的客户信息全部显示出来,因为一个客户全部信息我写在一个di

标签: jQuery实现checkbox即点即改批量删除及中间遇到的坑

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

上一篇:浅谈jquery中ajax跨域提交的时候会有2次请求的问题

下一篇:JQ图片文件上传之前预览功能的简单实例(分享)(jquery上传图片并预览)

  • 政府农民合作社架构
  • 个体户交税和个人所得税
  • 印花税科目会计分录
  • 微信支付属于现金嘛
  • 无发票情况说明怎么写学生
  • 企业注销当月无法申报个税
  • 事业单位取暖费标准
  • 资产剥离类型
  • 换汇成本太低怎么处理?
  • 公司委托其他公司办理事情
  • 营改增后应付职工薪酬如何核算个人所得税?
  • 核定征收的公司用做账么
  • 增值税发票价税合计是什么意思
  • 增值税专票的收款人必须是个人嘛
  • 手工发票有效期多久
  • 支票结算方式下用其他货币资金账户
  • 闲置资金的利息收益要冲减财务费用
  • 子公司注销如何做账
  • 支票票号都是第二行吗
  • 涉税票据如何避免税务风险?
  • 库存商品成本变动率
  • window10过期
  • 申请出具商标注意事项
  • 预缴的城建税怎么做账
  • 无法安装字体,显示字体无效win10
  • MacOS X Yosemite升级后postgresql启动报错的解决办法
  • 小规模纳税人进口增值税怎么处理
  • 企业对外捐赠扣除标准有哪些?
  • 商品流通会计科目
  • 企业汇算清缴怎么退税
  • php gethostname
  • msmpeng.exe是什么程序
  • 短期借贷属于负债类科目
  • 特许权使用费20%
  • vue中的组件有几类
  • 资产负债表中各项目的期末余额
  • 劳务费发票和建筑劳务费发票
  • java泛型类和泛型方法
  • 工会经费没有交能买发票吗
  • html怎么样
  • 给中间人回扣犯罪吗
  • 实收资本属于限定性净资产吗
  • 处置废品收入税率
  • 电影院租金一般多少为合理
  • 材料成本差异的含义
  • 劳务费个人所得税核定征收
  • 注册资本及构成
  • 政府会计制度之1613在建工程
  • 增值税发票超过多久不能抵扣
  • 退回的企业所得税计入什么科目
  • 广告费用怎么做账
  • 事业单位职工福利费使用范围和标准
  • 会计凭证的摘要 报销 保险费用
  • 怎么开具
  • 怎么设置现金流
  • sql中的递归
  • 怎么样创建
  • 安全升级
  • windows 10 周年更新
  • win10 edge浏览器
  • Win10预览版更新弹窗如何关闭
  • linux服务器dns怎么设置
  • 电脑导航阻止怎么办
  • windows10 预览
  • 深入理解中国式现代化
  • javascript基础笔记
  • python 正则 \s
  • jquery旋转动画
  • python 内置函数什么用来返回序列中的最大元素
  • 噩梦 1-4
  • jquery实例
  • 小规模纳税人购买车辆如何入账
  • 政府补贴 收入
  • 税务稽查预警指标
  • 企业年报通怎么注销
  • 福建省国税局官网
  • 中国的消费税是怎么算的
  • 地税局多措并举工作总结
  • 广东省广州市国资委
  • 国家税务总局2011年34号公告
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设