为什么 jQuery 的 triggerHandler() 不能阻止内联事件？答案

【问题标题】：Why jQuery's triggerHandler() doesn't prevent inline events?为什么 jQuery 的 triggerHandler() 不能阻止内联事件？
【发布时间】：2011-11-30 11:42:43
【问题描述】：

我为这个问题制作了这个测试代码：https://jsfiddle.net/5phqm/1/

据我了解，如果 jQuery 的 triggerHandler() 阻止默认浏览器行为，则不会触发和处理原生 JavaScript 事件（我的代码中的 addEventListener() 也是如此），而是通过标签的属性添加的内联事件onclick="" 无论如何都会被触发！为什么会发生？我对在浏览器中触发的事件有误解吗？

【问题讨论】：

对于它的价值，我一直认为这是遵循 CSS 规则的行为模式：内联代码覆盖了 head 中的代码，而 head 中的代码又覆盖了外部代码中的代码脚本。你可以简单地removeAttr('onclick')。
这不是一个直接的答案，但在 jQuery 网站上，他们声明他们不会花精力解决内联事件处理程序的问题：docs.jquery.com/Won't_Fix#Inline_Event_Handlers。我很想知道你的代码为什么会这样，但我认为不会有修复它（以防你发现它是一个错误）。

标签： javascript jquery eventtrigger

【解决方案1】：

因为是explicitly coded，所以可以确认inline handlers运行了：

handle = ontype && cur[ ontype ];
if ( handle && jQuery.acceptData( cur ) && handle.apply( cur, data ) === false ) {
    event.preventDefault();
}

这里ontype 是"onclick"。所以它正在获取元素的onclick 属性，然后执行它。这段代码总是被调用，不管.trigger/.triggerHandler。

然而，像 elem.click() 这样的原生操作仅在 inside an if block 执行：

if ( !onlyHandlers && !event.isDefaultPrevented() ) {
    // ...
    elem[ type ]();

其中onlyHandlers 是true 代表triggerHandle 和false 代表.trigger，因此triggerHandler 不执行例如elem.click()（而.trigger 有）。因此，本机操作被阻止。

因此内联处理程序和本机操作是分开的事情，也是分开处理的。 .triggerHandler 仅阻止本机操作。

【讨论】：

【解决方案2】：

我认为（但这是一个猜测，我简要查看了 jQuery 源代码，这可能是完全错误的）jQuery 通过调用类似的东西来检索附加到 jQuery.trigger.event 中元素的事件

   $(elem).data("events");

然后决定是否开火/停止它们。内联事件无法以这种方式收集，因此无法停止。

【讨论】：