在 Firefox 和 Chrome 中报告不同来源的实时点击事件答案

【问题标题】：Live click event reporting different source in Firefox vs Chrome在 Firefox 和 Chrome 中报告不同来源的实时点击事件
【发布时间】：2011-11-15 01:40:57
【问题描述】：

有了这个 HTML

<div>
  <button>
    <img src="https://img.skitch.com/20110912-1m2qj31m7sxmh46uheef63gutu.gif">
  </button>
</div>

还有这个 jQuery

$(document).ready(function() { 
  $("body").live("click", function(event) {
    $("body").append(event.target.tagName);            
  });
});

为什么事件目标节点在 Chrome 中是图片，而在 Firefox 中是按钮？

jsfiddle 测试 -> http://jsfiddle.net/MikeGrace/YC5A7/

【问题讨论】：

很奇怪。似乎 IE/FF 不希望内部内容中的禁用按钮。虽然 Chrome 这样做是合乎逻辑的 :(
哦，不！你正在使用直播。这让 jQuery 开发人员很难过 :( 试试 delegate()。paulirish.com/2010/on-jquery-live
IE9 也是按钮。如果您稍微移动定位，请检查一下。 jsfiddle.net/gmaZG
@OscarGodson 从 jQuery 1.7 开始，.live 和 .delegate 都在内部转换为 .on 方法。但是，最好将.on 分配给最近的DOM 容器（.delegate 样式）而不是整个文档（.live 样式）。
@Blazemonger 是的。那是在九月发布的。（）万岁！

标签： jquery event-handling cross-browser jquery-events

【解决方案1】：

当然，这不仅限于图像 -- 我在 http://jsfiddle.net/YC5A7/13/ 调整了您的代码，并通过普通超链接得到了相同的结果。

根据 jQuery 文档，event.target“可以是为事件注册的元素或它的后代。”因此，您的结果与该方法的预期目的一致。

但是，event.currentTarget 在所有浏览器中都有所需的结果：http://jsfiddle.net/YC5A7/16/

【讨论】：

非常有趣。感谢您的帮助！