更改事件未从页面触发答案

【问题标题】：change event not trigging from the page更改事件未从页面触发
【发布时间】：2017-11-27 04:10:22
【问题描述】：

最初我发布了这个问题。但随后我通过反复试验得到了答案。现在我想知道我的答案会起作用的原因。

在下面的saved page 中，当我从扩展程序运行$("#debitCard").change(); 时它不起作用，但是当我从Chrome 控制台运行时它起作用了？

为什么这种行为可能与从控制台运行时不同？我什至在 setTimeout 内运行过它

我什至在 HTML 中创建了一个按钮，单击它会调用此函数，但即使这样也不起作用。但是从控制台调用每次都有效。

回答

我将$("#debitCard").change(); 替换为：

var element = document.getElementById('debitCard');
var event = new Event('change');
element.dispatchEvent(event);

我想知道Javascript/JQuery这个怪癖的原因

【问题讨论】：

【解决方案1】：

您在扩展中拥有的 jQuery 在与内容页面中的 jQuery 或库不同的范围内运行。

如果内容页面中的功能使用 jQuery 或类似的事件处理程序，则不能在扩展范围内从 jQuery 调用这些处理程序，因为您无法引用它们。

但是触发事件，无论是本机还是在内容脚本中使用 jquery，都可以正常工作，并且会触发页面的处理程序。

编辑：

自从这篇文章以来，这个问题一直在我的脑海中，今天我找到了一个例子来说明我的原始观点 - 你不能（总是）使用 jQuery 触发事件处理程序：

目标：

<a id="vcemail-link"  href="#" onclick="signOut();">Sign out...</a>

我无法使用扩展中的 jquery 触发此 onclick 事件，我必须使用本机版本

$('#vcemail-link').click(); // doesn't work
document.getElementById('vcemail-link').click(); // works

@user5858 这可能会让您满意，也可能不满意，但它很重要且值得记住，我认为它也适用于内联 onchange()。

【讨论】：

刚刚添加了参考。它从马的嘴里解释。
我花了很长时间试图找到一个可以尝试的公共页面，以为我会证明我的答案。我没有，我反驳（部分）它。我正在修改我的答案，因为它有一些价值，但它不是您问题的答案。您不能直接调用事件处理程序（很明显吧？），因为您不能引用它们。但如果它们是事件驱动的，您可以在本机触发这些事件，也可以在扩展范围内使用 jquery 触发这些事件。
我所做的是将 javascript 注入页面并设法以这种方式触发事件。