jQuery 在 div > divs > a 中委托 :(答案

【问题标题】：jQuery delegateing inside div > divs > a also :(jQuery 在 div > divs > a 中委托 :(
【发布时间】：2012-01-06 01:51:49
【问题描述】：

html:

<div id="a">
  <a id="a0" href="#"></a>

  <div id="b"><a id="b0" href="#"></a><div>
<div>

jQuery:

$('#a').delegate('a', 'click', function(){ //do stuff });

也代表#b0。是否有任何巧妙的选择方法来忽略 #b ？

注意 /// div 内的链接是动态添加和分离的 ///

【问题讨论】：

值得注意的是，虽然 jQuery 1.7+ 支持 .delegate()，但新的 .on() 函数取代了它，因此更具前瞻性（1.7 还提高了事件绑定的性能）。语法几乎相同，除了事件（'click'）和选择器（示例中的'a'或 Luke 建议的变体）相反。
.on() vs .delegate()：性能速度和浏览器兼容性如何？
.on() 本质上是 .bind() 和 .delegate() 合二为一，由于重构，性能提升是巧合。 .on() 会更快（只是因为它被重构了）并且两者都应该同样跨浏览器兼容。

【解决方案1】：

如果你知道这只是直系后代尝试

$('#a').delegate('#a>a', 'click', function(){ alert('a') });

如果您知道要忽略 b 的子级，请尝试

$('#a').delegate('a:not(#b>a)', 'click', function(){ alert('a') });

编辑：a fiddle

【讨论】：

【解决方案2】：

这是按预期工作的。您的delegate() 调用将为#a 下匹配选择器a 的所有子级设置事件处理程序。

如果您尝试为特定元素设置处理程序，请执行此操作

$('#a0').click(function(){ ... });

你的 html 也很糟糕。确保关闭标签实际关闭。

【讨论】：

【解决方案3】：

委托方法中的第一个字段是选择器。截至目前，您正在选择所有锚点。请改用 id。

【讨论】：

他希望它适用于他添加的任何“a”，除了#b 中的那些
然后他可以将它们归为一个类。
完全正确:) 我什至对这个问题发表了评论。如果您修改答案以包含您的建议而不是您原来的不正确（可能被误导？）答案，这可能是一个好主意
我不认为，我的回答会误导任何人。总之，每个人都有自己的看法。我尊重你的:)
不不不，我的意思是我认为你在分析问题时被误导了（可能没有阅读注意事项），而不是完全错误:) 基本上，我不认为你回答了他的需要——不是因为你不知道你在说什么，而是可能因为你误读了它——因此是“误导”而不是“不正确”

【解决方案4】：

jQuery1.7或以上

$('#a').on('click', '#a0', function(event) {
    alert(event.target.id);
});

【讨论】：