jQuery click()事件没有触发加载AJAX的HTML元素

时间:2012-02-14 06:03:25

标签: javascript jquery ajax

这个主题非常能描述我的问题,我假设它不会以这种方式工作,有没有办法让它发挥作用? (解决方法)?

以下是通过AJAX加载的代码:

<div>
<div id="s0frame" class="sframe"></div>
<div id="s1frame" class="sframe"></div>
<div id="s2frame" class="sframe"></div>
<div id="s3frame" class="sframe"></div>
<div id="s4frame" class="sframe"></div>
<div id="s5frame" class="sframe"></div>
<div id="chatframe" class="chat alpha60"></div>
</div>

这是我的点击事件:

$('.sframe').bind('click', function() { 
    var seat_number = this.id.match(/\d/g);
    alert(seat_number); 
});

4 个答案:

答案 0 :(得分:79)

这样做。

 $(document).on("click",".sframe",function(e){
 var seat_number = this.id.match(/\d/g);
 alert(seat_number); 
 });

 $(document).delegate(".sframe","click",function(e){
 var seat_number = this.id.match(/\d/g);
 alert(seat_number); 

 });

编辑:

从jQuery 1.7开始,不推荐使用.live()方法。使用.on()附加事件处理程序。旧版jQuery的用户应该使用.delegate()。

答案 1 :(得分:16)

您必须将事件处理程序重新附加到DOM中的动态添加元素。 .live方法被广泛使用,但现在已被弃用。在jQuery 1.7+版本中,您可以使用.on,也可以使用.delegate

$(document).on("click",".sframe",function(e){

});

使用委托

$(document).delegate(".sframe","click",function(e){

});

答案 2 :(得分:4)

除非在将标记加载到页面之后调用.bind()函数,否则需要使用其他函数,如.live(),或者最好使用最新版本的jQuery,.on(),因为.bind ()仅针对运行时已经存在的DOM元素,而.live()和.on()为您提供了不同的范围选项,用于跟踪添加到页面的元素。

答案 3 :(得分:2)

$(document).on('click','sframe', function() { 
    var seat_number = this.id.match(/\d/g);
    alert(seat_number); 
});