关于jQuery用bind动态绑定事件无效的处理

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

于是不假思索的 用$(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数据代码
});

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

时间: 2024-10-12 22:58:15

关于jQuery用bind动态绑定事件无效的处理的相关文章

jquery生成元素注册事件无效,及事件委托的使用

在页面加载完成之后,我们在页面操作用js生成html代码到页面,动态的添加元素带页面上 但是,这里可能很多人就必须碰到的一个问题就出现了,当你之后动态添加了元素到页面上,发现这个元素的绑定事件无效,如click点击了根本没有作用 这里就要用到事件委托让未来元素能绑定事件 方法一 $("div").delegate("#id", "click", function(){ ...............}); 这样做就能保证你未来生成的元素也能绑定单

jQuery 1.9+ ajaxStart事件无效,无法被触发的原因。

AJAX 事件需要绑定到document 在jQuery 1.9中, 全局的AJAX事件(ajaxStart, ajaxStop, ajaxSend, ajaxComplete, ajaxError, and ajaxSuccess) 只能在document元素上触发.修改AJAX事件监听程序到document元素上.例如,如果目前的代码看起来像这样: $(“#status”).ajaxStart(function(){ $(this).text(“Ajax started”); }); 修改成

jQuery中的bind绑定事件与文本框改变事件的临时解决方法

暂时没有想到什么好的解决办法,我现在加了个浏览器判断非ie的话就注册blur事件,这样有个问题就是blur实在别的控件活动焦点的时候,txtStation控件注册的方法是为了填充它紧挨着的一个下拉列表一直没什么兴趣看jQuery,就用自己那点不咋样的javascript硬撑着,今天写一个功能时想尝试一下,用bind注册事件时发现怎么都不好使$("#txtStation").bind("onpropertychange", GetStationLevel); 复制代码

javascript与jquery动态绑定事件需要先加载页面注意的坑

1.javascript的Dom对象动态事件绑定注意以下2点,如:document.getElementById("id名称").addListenerEvent("事件名称",function(){代码},false),动态绑定事件,事件名称不加on,如:click,mouseover等. (1)如果<script>绑定代码</script>写在<body>html代码</body>前面,则必须先使用加载页面语句wi

jquery中四个事件绑定方式(bind,live,delegate,on)

bind() 简要描述 bind()向匹配元素添加一个或多个事件处理器. 使用方式 $(selector).bind(event,data,function) event:必需项:添加到元素的一个或多个事件,例如 click,dblclick等: 单事件处理:例如 $(selector).bind("click",data,function); 多事件处理:1.利用空格分隔多事件,例如 $(selector).bind("click dbclick mouseout"

jquery json遍历和动态绑定事件

<div id='tmpselectorList' style='border: 1px solid grey;max-height: 150px;position:absolute;text-align: left; overflow: auto;background:white;width:153px;'> </div> <script type="text/javascript"> $(document).ready(function () {

jquery的bind跟on绑定事件的区别

Jquery的bind跟on绑定事件的区别:主要是事件冒泡(事件代理): jquery文档中bind和on函数绑定事件的用法: .bind(events [,eventData], handler) .on(events [,selector]  [,data], handler) 从文档中可以看出,.on方法比.bind方法多一个参数'selector' .on的selector参数是筛选出调用.on方法的dom元素的指定子元素,如: $('ul').on('click', 'li', fun

Vue 接收数据for循环渲染出的标签jQuery渲染的点击事件无效

Vue 接收数据for循环渲染出的标签jQuery渲染的点击事件无效 Vue在渲染页面的时候使用jQuery的时候会发现当在created生命周期中获取后台数据,写在 mounted 生命周期的jquery渲染的点击事件不管用了. 理论上,mounted是界面html生成结束才会开始执行的,应该是可以的,但实际效果就是不行. 原因 问题的原因出现在,jquery确实在界面HTML生成之后执行了,但是当时向后台请求的数据还没请求回来,当请求回来用for循环重新渲染数据后,jquery已经执行完了,

jquery中bind()绑定多个事件

bind()绑定事件 $(selector).bind(event,data,function): 参数event为事件名称(如"click,mouseover....."),data是可选的,规定传递到函数的额外数据,function为事件执行的函数. 绑定单个事件比较简单 $("button").bind("click",function(){ //事件处理内容... }); 绑定多个事件时,参数在一个大括号里面,event可以加双引号也可以