位置: 编程技术 - 正文

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上传图片并预览)

  • 餐饮业购买的油类有哪些
  • 税率降低怎么算降税额
  • 实收资本增加的原因
  • 制造业三项费用占比行业怎么算
  • 没有认证的增值税专用发票怎么做账
  • 建筑施工企业收到工程款会计分录
  • 企业之间无偿借款
  • 购房补贴退契税3个月没到账
  • 出让固定资产怎样计算增值税
  • 三证合一后银行开户许可证还有吗
  • 承包费会计处理
  • 销售退回的会计分录金额怎么写
  • 普通商户怎么开小票
  • 简易征收进项税额转出什么意思
  • 公司收款收据
  • 制作费计入什么会计科目
  • 差额纳税销项税额抵减
  • 土地证是商业用地
  • 税控机操作
  • 会计人必读的20本书
  • 退休人员返聘后辞退怎样补偿
  • 公司一般根据什么裁员
  • 消费满额赠礼
  • 成品油发票应该怎么冲红?
  • 医疗保险费扣除比例
  • 应交税费的余额怎么计算
  • 筹办期间的筹办费用支出
  • 抽奖得奖
  • 老板私车转让给老板
  • windows defender隔离区
  • 在幻灯片中导入视频文件后视频文件时被几个圆点框选
  • 财管如何区分金额大小
  • 华为手机网络拒绝接入怎么解决
  • 独享20m网速快吗
  • 私营合伙企业个税怎么算
  • pc direct
  • 购入工程物资用于建设厂房,购入后直接领用至工程项目
  • vue项目中技巧知识点
  • 税法工资薪金总额
  • html5新增的标签元素有哪些
  • php使用( )关键字来创建对象
  • 工程建设质保金比例
  • 尚硅谷百度贴吧
  • 工程结算在资产负债表中哪个科目显示
  • 出售长期股权投资的交易费用
  • Node.js——http模块和导出共享
  • 一般纳税人之间转让土地使用权交哪些税金
  • 小微企业的税收优惠政策2023
  • 新成立的小公司财务怎么管理
  • 海关完税凭证抵税怎么算
  • 新办企业小规模纳税人多久可以申请发票增量
  • 在SQL Server中使用存储过程的优点包括
  • sql server 2005怎么用
  • 建筑工程维修费占总费用多少
  • 单位卖车怎么做账
  • 投资性房地产转为存货
  • 开具发票涉及到哪些会计科目?
  • 企业无力支付票据时应计入
  • 本月未过账的凭证怎么写
  • 商品进销差价的作用
  • 办公用品怎么开大额发票
  • 解析关于sql语句的实现
  • sql server的相关技术知识
  • mac安装mysql没看见初期密码
  • xp系统强制删除文件
  • linux设置时间日期
  • 限制root用户远程登录
  • linux安装fping
  • Linux Bash Shell入门教程
  • JavaScript中数组长度的属性
  • js中的call方法和apply方法
  • Node.js中的construct构造函数
  • unityapi解析
  • Android使用HttpURLConnection和HttpClient请求服务器数据
  • python sco
  • 个人去税务局开劳务费怎么开
  • 企业吸收合并都包括什么
  • 地税发票在哪里开
  • 山东居民养老金是多少
  • 公司收购农民的农产品能贴我公司标签吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设