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弹幕效果
May 06 jQuery
jQuery返回定位插件详解
May 15 jQuery
jQuery自定义多选下拉框效果
Jun 19 jQuery
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
Jul 08 jQuery
基于jquery实现多级菜单效果
Jul 25 jQuery
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 jQuery
基于jquery的on和click的区别详解
Jan 15 jQuery
学习jQuery中的noConflict()用法
Sep 28 jQuery
jquery实现垂直无限轮播的方法分析
Jul 16 jQuery
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
jQuery 动画与停止动画效果实例详解
May 19 jQuery
jQuery中event.target和this的区别详解
Aug 13 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常用数组函数介绍
2014/07/28 PHP
PHP给源代码加密的几种方法汇总(推荐)
2018/02/06 PHP
PHP实现登录验证码校验功能
2018/05/17 PHP
PHP+jQuery实现即点即改功能示例
2019/02/21 PHP
Javascript改变CSS样式(局部和全局)
2013/12/18 Javascript
jsPDF导出pdf示例
2014/05/02 Javascript
jquery中的ajax方法怎样通过JSONP进行远程调用
2014/05/04 Javascript
BootStrap+Angularjs+NgDialog实现模式对话框
2016/08/24 Javascript
jQuery-mobile事件监听与用法详解
2016/11/23 Javascript
HTML中使背景图片自适应浏览器大小实例详解
2017/04/06 Javascript
JS实现身份证输入框的输入效果
2017/08/21 Javascript
JS对象序列化成json数据和json数据转化为JS对象的代码
2017/08/23 Javascript
Angular angular-file-upload文件上传的示例代码
2018/08/23 Javascript
[00:43]2016完美“圣”典风云人物:单车宣传片
2016/12/02 DOTA
[01:16:28]DOTA2-DPC中国联赛 正赛 iG vs Magma BO3 第二场 2月23日
2021/03/11 DOTA
python文件比较示例分享
2014/01/10 Python
跟老齐学Python之有容乃大的list(4)
2014/09/28 Python
python实现计算资源图标crc值的方法
2014/10/05 Python
python基于xmlrpc实现二进制文件传输的方法
2015/06/02 Python
Python中的with语句与上下文管理器学习总结
2016/06/28 Python
Python中shutil模块的常用文件操作函数用法示例
2016/07/05 Python
浅析Python数据处理
2018/05/02 Python
使用Python实现一个栈判断括号是否平衡
2018/08/23 Python
AUC计算方法与Python实现代码
2020/02/28 Python
基于python实现删除指定文件类型
2020/07/21 Python
python绘制高斯曲线
2021/02/19 Python
Html5 canvas实现粒子时钟的示例代码
2018/09/06 HTML / CSS
Bodum官网:咖啡和茶壶、玻璃器皿、厨房电器等
2018/08/01 全球购物
中东奢侈品市场:Coveti
2019/05/12 全球购物
护士实习鉴定范文
2013/12/22 职场文书
五水共治一句话承诺
2014/05/30 职场文书
党的群众路线个人对照检查材料
2014/09/23 职场文书
小学五年级语文上册教学计划
2015/01/22 职场文书
2015年宣传部工作总结范文
2015/03/31 职场文书
javascript条件式访问属性和箭头函数介绍
2021/11/17 Javascript
windows安装 redis 6.2.6最新步骤详解
2022/04/26 Redis