jQuery .on() 给了我错误的“这个”答案

【问题标题】：jQuery .on() is giving me the wrong "this"jQuery .on() 给了我错误的“这个”
【发布时间】：2014-01-31 21:52:11
【问题描述】：

可能是一个耳光解决方案，但是：

<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...)。可以吗？

【问题讨论】：

看起来不错jsfiddle.net/arunpjohny/xNnp2

标签： jquery event-handling targeting

【解决方案1】：

你需要在这里添加报价click like - 'click' 然后一切都会好的，@Arun 已经提交了小提琴。

试试这个 -

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

【讨论】：

这绝对有效。 [打头！] 不幸的是，在我更复杂的现实世界代码中，我似乎无法使$(this) 调用工作。下次我看看能否更准确地重现该问题...谢谢。
如果您愿意看一下...我能够用伪代码重现我的实际问题：jsfiddle 我只会在警报中收到“foo”。
@anthony: $('#foo').on('click','p', ... 不是 $('#foo').on('click',$p, ...
@anthony 你在foo id 上应用了on 方法，所以它抛出了这个
@anthony 和 Kabie 的建议这次会提示 bar_1

【解决方案2】：

两种解决方案：

替换

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

与

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

（如前所述，您需要在点击前后加上引号）。

或者，替换

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

与

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

我不能保证第一种方法可以很好地处理 AJAX 加载，但我相信第二种方法应该可以正常工作。

【讨论】：