无法删除 chrome 中的内联事件处理程序

Question

我想从包含 onsubmit 内联定义的表单中删除事件处理程序。

<form id="loginForm" onsubmit="return performTask(this);">

我已经试过了:

$("#loginForm").off("submit")
$("#loginForm").unbind("submit")
$("#loginForm").die("submit")
$("#loginForm").removeAttr("onsubmit")
$("#loginForm").removeProp("onsubmit")
$("#loginForm").attr("onsubmit", "")
$("#loginForm").prop("onsubmit, "")
$("#loginForm")[0].onsubmit = null
$("#loginForm")[0].onsubmit = undefined
$("#loginForm")[0].onSubmit = null
$("#loginForm")[0].onSubmit = undefined

没有任何效果！

我使用 jquery 方法 on() 添加了我自己的事件侦听器，但它从未被调用。看来旧的事件侦听器在我的之前执行...它对按钮上的 onClick 事件做同样的事情。

我必须明确表示我在 chrome 扩展中，更准确地说是在页面中注入的内容脚本中。

所以问题是，有什么办法可以清除事件处理程序吗？或者更好的是有什么方法可以添加一个事件侦听器，它将在内联处理程序之前调用？

编辑：经过大量丑陋的代码，我找到了一种方法来做我想做的事...我复制了一份表格，删除了内联事件处理程序，替换为 dom 旧的由我形成，然后创建我的事件处理程序。它很难看，但它有效......如果有人能解释为什么我不能用其他方式做到这一点......

Answer 1

其实我不知道这里处理的是'onSubmit'事件的对象，所以这里使用伪逻辑：

识别正在处理其事件的对象 - 例如 obj。
识别它的注册事件 - console.log(obj._events); - 说出来returns提交[功能]
清除回调：obj._events.submit = null;
注册您的处理程序。

希望对您有所帮助。

Answer 2

试试这个：

window.addEventListener('submit', function(event) {
    event.stopImmediatePropagation();
}, true);

它将停止事件的传播。

Answer 3

这是一个 isolated world 问题。 Chrome extensions 运行是一个独立于页面的上下文；虽然对 DOM 的访问是共享的，但 内联事件侦听器是隔离的 .

引用文档，强调我的：

It's worth noting what happens with JavaScript objects that are shared by the page and the extension - for example, the window.onload event. Each isolated world sees its own version of the object. Assigning to the object affects your independent copy of the object. For example, both the page and extension can assign to window.onload, but neither one can read the other's event handler. The event handlers are called in the order in which they were assigned.

因此，要覆盖页面级侦听器，您需要将覆盖代码注入页面上下文本身。这个有可能;有关详细信息，请参阅 this excellent answer，这是一个示例：

var actualCode = "document.getElementById('loginForm').onsubmit = null;";
var script = document.createElement('script');
script.textContent = actualCode;
(document.head||document.documentElement).appendChild(script);
script.parentNode.removeChild(script);

这会向页面添加一个 <script> 元素，然后在页面自己的上下文中执行。

无法删除 chrome 中的内联事件处理程序

Can't remove inline event handler in chrome

javascript

jquery

events

google-chrome

google-chrome-extension