javascript - 如何从纯javascript代码中取消jQuery.click？

Question

为了简单起见:

我有一个网页。它有一些脚本，其中一个将点击事件绑定(bind)到 标记。

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

我想在这个页面添加一个纯javascript(我不允许修改其他js文件)并控制点击事件。我尝试过的方法如下:

document.getElementById('someId').onclick = function (event) {
    if (someCondition) {
        // cancel this click event 
        event.preventDefault();
        event.stopPropagation();
        event.cancel = true;
        return false;
    } else {
        // do something else.
    }
};

这段代码似乎不起作用。我需要一些帮助。

更新

抱歉我的语言含糊不清。我所说的“纯 javascript”是指“使用基本的 javascript 操作而不是 jQuery 方法。”

Answer 1

I want to add a pure javascript to this page (I'm not allowed to modify other js files) and take control of the click event.

如果代码将位于该页面上，它可以使用 jQuery，这很好，因为这也是取消注册 jQuery 注册处理程序的唯一方法:

$("#someId").off("click").on("click", function() {
    // Your new code here
});

在元素上调用 .off("click") 会从该元素中删除所有 jQuery 注册的 click 处理程序。

也就是说，通常有比破坏页面上其他代码注册的处理程序更好的方法。

<小时/>

为什么不使用 jQuery 就无法取消注册 jQuery 注册的处理程序:第一次通过 jQuery 将特定事件 Hook 到特定元素时，jQuery 会注册一个处理程序(它自己的)来使用对于该元素上的该事件；如果附加了更多处理程序，它只会将它们添加到自己的内部列表中，而不会向 DOM 注册它们。相反，当 DOM 事件被触发时，jQuery 会遍历其处理程序列表并触发它们。

要取消注册元素上事件的 jQuery 实际处理程序，您必须获取对注册它时使用的特定函数实例 jQuery 的引用。 (removeEventListener 没有相当于上面“清除所有事件”的功能)。 该引用只能从 jQuery 闭包内的数据结构中获得，因此如果不使用 jQuery，则无法获取它。

<小时/>

What should I do if other handlers need to resume to be executed under some circumstances in the $.on() block?

啊，这更困难。这一切都取决于比您的问题中存在的更多上下文。一些选项:

1. 到目前为止，最好的办法是修改处理点击的其他代码。但我明白你是说你不能这样做。

2. jQuery 按照注册的顺序调用处理程序(这是它自己处理调用多个处理程序的原因之一；不同的浏览器以不同的顺序执行操作)。因此，如果您可以在其他代码执行之前在上 Hook #someId 上的 click，那么您就可以可靠地使用 event.stopImmediatePropagation() 以防止调用其他处理程序。当然，如果您的处理程序不是列表中的第一个，那么这将不起作用，因为其他处理程序将首先被调用。

3. 如果 #someId 元素中有一个元素完全填充了它，您可以将 click Hook 到 该 元素上，然后使用 event.stopPropagation() 阻止事件冒泡到 #someId 元素。

4. 当然，如果没有像#3这样的元素，您可能可以插入一个(通过代码动态地)并移动#someId的内容放入其中，这样您就可以将处理程序注入(inject)到冒泡中。

5. 您可以深入了解 jQuery 的内部结构并弄清楚如何访问事件处理程序链并对其进行操作。过去这很容易；我认为最近的版本变得更加困难。当然，这将进入未记录的领域，该领域可能会随着任何“点”版本的发布而改变。