这是我的问题:是否可以以某种方式检查是否存在一个动态附加的事件侦听器?或者我怎么能在DOM中检查“onclick”(?)属性的状态?我已经在互联网上搜索了一个解决方案,就像Stack Overflow,但没有运气。这是我的html:

<a id="link1" onclick="linkclick(event)"> link 1 </a>
<a id="link2"> link 2 </a> <!-- without inline onclick handler -->

然后在Javascript中,我附加了一个动态创建的事件监听器到第二个链接:

document.getElementById('link2').addEventListener('click', linkclick, false);

代码运行良好,但我所有的尝试检测附加的侦听器失败:

// test for #link2 - dynamically created eventlistener
alert(elem.onclick); // null
alert(elem.hasAttribute('onclick')); // false
alert(elem.click); // function click(){[native code]} // btw, what's this?

jsFiddle在这里。 如果你点击“Add onclick for 2”,然后点击“[link 2]”,事件会正常启动, 但是“测试链接2”总是报告错误。 有人能帮帮我吗?


当前回答

可能的重复:检查元素上是否有事件监听器。没有jQuery 请在那里找到我的答案。

下面是Chrome浏览器的基本技巧:

getEventListeners(document.querySelector('your-element-selector'));

其他回答

你好,我在这里提出我的方法,它以某种方式工作,以避免在DOM的同一元素上进行多个侦听。我的方法使用JQUERY,但原理如下:

在对应用程序进行特定处理(必须在DOM元素(如click)上重新生成侦听器)之后,我们首先删除该事件以避免多次出现该事件,然后立即重新创建它。

这一原则要根据需要加以调整。这只是原理。我向你展示如何在jquery。

line 1 : $(_ELTDOM_).unbind('click');
line 2 : $(_ELTDOM_).bind('click',myFct);

我希望通过调整这个解决方案可以帮助到一些人。我坚持认为,这种解决方案不一定适用于所有情况,但它已经使解决与双、三重……相关的问题成为可能。例如,由于同一元素上的多个侦听而导致的同时处理

我要做的是在你的函数外面创建一个布尔值,开始时为FALSE,当你附加事件时被设置为TRUE。在再次附加事件之前,这将作为某种标志。这里有一个关于这个想法的例子。

// initial load
var attached = false;

// this will only execute code once
doSomething = function()
{
 if (!attached)
 {
  attached = true;
  //code
 }
} 

//attach your function with change event
window.onload = function()
{
 var txtbox = document.getElementById('textboxID');

 if (window.addEventListener)
 {
  txtbox.addEventListener('change', doSomething, false);
 }
 else if(window.attachEvent)
 {
  txtbox.attachEvent('onchange', doSomething);
 }
}

理论上,你可以通过addEventListener和removeEventListener来为“this”对象添加remove标志。丑八怪和我还没测试过…

var listenerPaste = pasteAreaElm.hasOwnProperty('listenerPaste');
if (!listenerPaste) {
    pasteAreaElm.addEventListener("paste", onPasteEvent, false);
    pasteAreaElm.listenerPaste = true;
}

可能的重复:检查元素上是否有事件监听器。没有jQuery 请在那里找到我的答案。

下面是Chrome浏览器的基本技巧:

getEventListeners(document.querySelector('your-element-selector'));