jQuery .on() 给了我错误的"这个"

Question

可能是一个很好的解决方案，但是：

<div id="foo">
   <!-- this will all be replaced periodically via AJAX -->
   <p id="bar_1">click me</p>
   <p id="bar_2">click me</p>
   <p id="bar_3">click me</p>
   <!-- end AJAXed section -->
</div>
$('#foo').on(click,'p',function(){
   alert($(this).attr('id'));
   //returns "foo"
});

单击任何p警报"foo"。如何返回"bar_n"，即单击的p的id？

我的目标是外部div，因为它是可靠的，不会被AJAX取代。在.on（）方法中，我以内部p为目标（子目标？），因为这是我真正想将单击处理程序绑定到的。所有的p都会定期被替换，它们的绑定也会丢失，因此，我不能简单地说$('p').on(click...)。我可以吗？

Answer 1

你需要在这里添加引用click，就像-'click'一样，然后一切都会好起来的，fiddle已经由@Arun提交了。

试试这个-

$('#foo').on('click','p',function(){
   alert($(this).attr('id'));
   //returns "foo"
});

Answer 2

两种解决方案：

更换

$('#foo').on('click','p',function(){

带有

$('#foo p').on('click',function(){

（如前所述，单击时需要引号）。

OR，更换

alert($(this).attr('id'));

带有

alert($(event.target).attr('id'));

我不能保证第一个方法在AJAX加载时会很好，但我相信第二个方法应该可以很好地工作。