怎么让后面加载的'.a'能够触发那个click事件？

Question

Jquery插入dom后，插入部分无法调用js。

例如：
html:

<div class="a"><div>
<div class="b"><div>

在，js文件里有：

$(function(){
  $('.a').click(function(){    alert('ok');
  })
  $('.b').click(function(){
    $("<div class='a'></div>").insertAfter($(this));
  })
})

那么新的dom结构就是

<div class="a"><div>
<div class="b"><div>
<div class="a"><div>

而后面那个a点击的时候就不会触发$('.a').click事件

Answer 1

你应该使用 on 事件进行绑定。$(function(){ &nbsp;&nbsp;$("body").on("click",&nbsp;'.a',&nbsp;function(){&nbsp;&nbsp;&nbsp;&nbsp;alert('ok'); &nbsp;&nbsp;}); &nbsp;&nbsp;$('.b').click(function(){ &nbsp;&nbsp;&nbsp;&nbsp;$("<div&nbsp;class='a'></div>").insertAfter($(this)); &nbsp;&nbsp;}); })

Answer 2

因为你创建的新结构没有绑定事件，如果希望绑定的结构也有事件，你可以考虑把事件绑定到body，然后通过判断点击事件的节点是否有 calss=a，来加载相应的事件；&nbsp;&nbsp;$('body').click(function(e){&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;t&nbsp;=&nbsp;$(e.target);&nbsp;&nbsp;&nbsp;&nbsp;if(t.hasClass('a')){......} &nbsp;&nbsp;})