Question

这应该很简单：）

我想添加一个click事件监听器，以防它早先没有添加，并阻止它运行两次。我想要像这样完成这个：

HTML

<a href="http://www.google.com"> Google is your friend </a>
<a href="http://www.Bing.com"> Bing's alright as well </a>

JS

var links = document.getElementsByTagName("a");
for (var i=0; i<links.length; i++)
{
    if (*Default has been prevented for links[i]*){ //how do I implement this check?
        return; //do nothing, we're all done.
    } else {
        links[i].addEventListener("click",function(event){
            event.preventDefault();
            alert("Showing you this instead of opening this link!"); 
        });
    }
}

在我的真实案例中，添加的事件侦听器阻止了默认行为。那么如何检查之前是否已被阻止？我想确保听众不会被添加两次。我该如何实施这项检查？
非常感谢任何想法。

Answer 1

您可以使用对象标识实现目标。引用from MDN：

多个相同的事件监听器

如果在同一个上注册了多个相同的EventListener   EventTarget具有相同的参数，重复的实例是   丢弃。它们不会导致EventListener被调用两次，并且   由于重复项被丢弃，因此不需要删除它们   使用removeEventListener方法手动。

示例：

// the "one" handler function instance
var theEventPreventDefaultHandler = function (event) {
    event.preventDefault();
};

var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
    links[i].addEventListener("click", theEventPreventDefaultHandler);
}

观看Fiddle。

~~我没有检查出来，但是当addEventListener函数没有添加“重复”时，有可能undefined函数返回false来捕获大小写。~~它没有't，仅返回.data("events")。

本机不支持“检查事件是否具有处理程序”。这在jQuery中是可能的，因为它管理this数组中的处理程序，也支持IE window.event和{{1}}中的旧怪癖行为。也就是说，重新实现ejohn所做的事情将是一件痛苦的事。有关stackoverflow的一系列问题：

Javascript如何判断侦听器上是否发生了event.preventDefault

1 个答案: