位置: 编程技术 - 正文

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

  • 免税收入进项税额转出比例结转法
  • 逐期增长量与累计增长量的关系是
  • 库存现金的使用范围
  • 注销有几种方法
  • 未达起征点销售额怎么填申报表
  • 机械设备租赁印花税谁交
  • 发票不走账对哪方有害
  • 无形资产增资账务处理
  • 小规模纳税人开票税率
  • 发票作废进项税额转出怎么做账
  • 研发加计扣除税率
  • 销售固定资产可以开专票吗
  • 跨年发票能否次年入账
  • 国有土地租金怎么交税
  • 收到财产保险赔款会计分录
  • 增值税纳税申报表在哪里查询
  • 企业销售收入含不含税
  • 个人所得税的税率是多少
  • 购买原材料无法确认收入
  • win11 zen1
  • 预提成本的账务处理
  • 客户用商品抵应收账怎么做
  • windows10如何显示桌面图标
  • php写json
  • os x yosemite dp6下载 os x 10.10 dp6官方下载地址
  • avc格式是什么
  • js16.vip
  • 企业发行股票的会计分录
  • 股权转让会记分录
  • 装修费用如何做分录
  • 应收账款净额可以是负数吗
  • php判断useragent
  • 高通 adc
  • pytorch基础教程
  • nodejs vue
  • thinkphp模型作用
  • php实现文件上传的函数
  • telnet命令大全
  • python3.9怎么清屏
  • python关键字参数位置参数
  • 个体工商户要做账报税吗
  • 企业支付的费用化的一般借款利息支出属于什么
  • 基本户能转账吗现在
  • 小型微利企业计算企业所得税
  • 京东预付是什么意思
  • 软件购买商城
  • 母子公司之间的借款
  • 收据为什么不能写今收到
  • 预计负债初始计量的最佳估计数的确定
  • 到银行货款现金怎么货
  • 累计盈余下级科目
  • MySQL删除重复数据只保留一条
  • windows vista X86 RTM/OEM 中文正式版下载地址
  • 电脑怎么安装安全控件
  • windows2003域控制器
  • linux的tar命令详解
  • centos7内存占用大
  • windows怎么查
  • mac打印预览快捷键是什么
  • win8系统如何关闭杀毒系统
  • win7旗舰版显示器亮度调节
  • icloud怎么加密码
  • linux常用命令cat
  • java4Android(15)处理流的使用示例、装饰者设计模式、节点流和处理流的关系
  • 自定义控件英文
  • 使用js如何创建元素
  • unity的shader用法
  • 关于javascript函数
  • jquery ajax双击div可直接修改div中的内容
  • jquery插件是干什么的
  • animate怎么整个图层移动
  • python如何切行
  • jQuery使用ajax跨域获取数据的简单实例
  • 如何开具红字发票明细
  • 进入杭州车辆怎么申请
  • 网上交购置税怎么拿完税证明
  • 依法纳税的看法
  • 有关节能环保的英语作文
  • 教育费附加地方教育费附加税率
  • 个体户刻公章需要备案吗
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设