jQuery使用bind动态绑定事件无效的处理方法


Posted in jQuery onDecember 11, 2018

最近在进行页面开发,在做页面特效的时候,需要给一个动态加载的按钮赋予一个事件

于是不假思索的 用$(obj).bind();  来绑定事件 。

但是这样存在一个问题:

bind确实能绑定事件,但是那是相对于固定的html标签来说

当页面内容属于动态加载的时候,bind事件就存在一个bug,  只能bind一次,当你第二次触发事件的时候就没用了

例如:

我给<a>标签赋予一个click , <a>标签包括内容都是从后台数据读取然后动态加载的。当我使用bind来绑定click事件,这时, 第一次点击click能成功触发

但是第二次点击,click事件无效了.

后面研究发现,jQuery还有个绑定事件的方法:delegate();  用法如下:

$(".sentnum-box").delegate(".a-add-ordergoods","click",function(){ 
  //js数据代码
});

这样就能实现对动态数据绑定事件,并永不失效

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

jQuery 相关文章推荐
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
jQuery动态追加页面数据以及事件委托详解
May 06 jQuery
jQuery操作之效果详解
May 19 jQuery
jQuery中each循环的跳出和结束实例
Aug 16 jQuery
jQuery实现用户信息表格的添加和删除功能
Sep 12 jQuery
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
jQuery NProgress.js加载进度插件的简单使用方法
Jan 31 jQuery
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 jQuery
jQuery实现的3D版图片轮播示例【滑动轮播】
Jan 18 jQuery
jQuery中DOM操作原则实例分析
Aug 01 jQuery
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
如何在vue 中引入使用jquery
Nov 10 jQuery
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 #jQuery
jQuery实现的模仿雨滴下落动画效果
Dec 11 #jQuery
jQuery实现数字自动增加或者减少的动画效果示例
Dec 11 #jQuery
JQuery实现ajax请求的示例和注意事项
Dec 10 #jQuery
jQuery选择器选中最后一个元素,倒数第二个元素操作示例
Dec 10 #jQuery
jQuery+css last-child实现选择最后一个子元素操作示例
Dec 10 #jQuery
JQuery Ajax执行跨域请求数据的解决方案
Dec 10 #jQuery
You might like
php创建多级目录代码
2008/06/05 PHP
二进制交叉权限微型php类分享
2014/02/07 PHP
PHP实现微信发红包程序
2015/08/24 PHP
PHP计算数组中值的和与乘积的方法(array_sum与array_product函数)
2016/04/01 PHP
学习YUI.Ext 第二天
2007/03/10 Javascript
JS IE和FF兼容性问题汇总
2009/02/09 Javascript
Javascript 自定义类型方法小结
2010/03/02 Javascript
jQuery图片的展开和收缩实现代码
2013/04/16 Javascript
jquery表格内容筛选实现思路及代码
2013/04/16 Javascript
jQuery之自动完成组件的深入解析
2013/06/19 Javascript
javascript间隔刷新的简单实例
2013/11/14 Javascript
JS实现简单的图书馆享元模式实例
2015/06/30 Javascript
JavaScript设计模式初探
2016/01/07 Javascript
JS插件plupload.js实现多图上传并显示进度条
2016/11/29 Javascript
js使用generator函数同步执行ajax任务
2017/09/05 Javascript
js移动端图片压缩上传功能
2020/08/18 Javascript
jQuery使用each遍历循环的方法
2018/09/19 jQuery
Element-ui DatePicker显示周数的方法示例
2019/07/19 Javascript
vue监听键盘事件的相关总结
2021/01/29 Vue.js
python基础入门详解(文件输入/输出 内建类型 字典操作使用方法)
2013/12/08 Python
Python使用xlrd读取Excel格式文件的方法
2015/03/10 Python
利用python获取某年中每个月的第一天和最后一天
2016/12/15 Python
Python之dict(或对象)与json之间的互相转化实例
2018/06/05 Python
在python里面运用多继承方法详解
2019/07/01 Python
python绘制动态曲线教程
2020/02/24 Python
html5使用canvas绘制一张图片
2014/12/15 HTML / CSS
Brother加拿大官网:打印机、贴标机、缝纫机
2019/10/09 全球购物
乌克兰珠宝大卖场:Zlato.ua
2020/09/27 全球购物
Shell脚本如何向终端输出信息
2014/04/25 面试题
工程造价自荐信
2013/10/09 职场文书
资产经营总监岗位职责范文
2013/12/01 职场文书
感恩节活动方案
2014/01/27 职场文书
年终奖发放方案
2014/06/02 职场文书
拾金不昧表扬信
2015/01/16 职场文书
工作自我评价范文
2015/03/05 职场文书
JVM钩子函数的使用场景详解
2021/08/23 Java/Android