Question

我有一个JavaScript函数来设置某些HTML节点的“onclick” - 事件 - 即使之前设置了“onclick”-event。

如何检查是否已设置该事件，因此我可以扩展我的功能，仅在尚未设置的HTML节点上设置事件？

Answer 1

检查，如下：

if(typeof someNode.onclick == "function") {
   // someNode has an event handler already set for the onclick event...
}

顺便说一下，如果您使用的是库，那么您应该这样说 - 如果您这样做，它可能更容易/更清洁，并且根据您使用的库而有所不同......

Answer 2

应该可以通过拦截对函数的调用来检测使用<element>.addEventListener()附加的事件处理程序：

var myListOfAddedEvents = [];

var realAddEventListener = HTMLElement.prototype.addEventListener;

HTMLElement.prototype.addEventListener = function(evtType,fn,cap) {
    myListOfAddedEvents.push(
        {on: this, type: evtType, handler: fn, capture: cap}
    );

    return realAddEventListener.apply(this, arguments);
};

注意：这是未经测试的代码，可能需要一些工作。我希望希望所有元素类型都会使用这个相同的函数，但我可能错了。此外，只有在开始添加事件之前可以运行这段代码，它才会起作用。可以类似地构建attachEvent的副本。

Answer 3

<input type="button" id="foo" name="foo" value="bar" />

<script type="text/javascript">
    alert(document.getElementById('foo').onclick); //undefined
</script>

所以你想要做的是这样的事情：

<script type="text/javascript">
    if (undefined == document.getElementById('foo').onclick)
    {
        // Add event handler
    }
</script>

Answer 4

另一种选择，将类添加到元素

if(!elem.class.match('hasEvent'))
{
  elem.addEventListener(event, function(){});
  elem.className = elem.className + ' hasEvent';
}

如何检查是否已设置JavaScript-Eventhandler？

4 个答案: