javascript - Hur man kontrollerar om en dynamiskt bifogad händelselyssnare finns eller inte?

Här är mitt problem: är det på något sätt möjligt att kontrollera om en dynamiskt bifogad händelselyssnare finns? Eller hur kan jag kontrollera statusen för "onclick" (?)-egenskapen i DOM? Jag har sökt på internet, till exempel på Stack Overflow, efter en lösning, men utan framgång. Här är min html:

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

Sedan i Javascript fäster jag en dynamiskt skapad händelselyssnare på den andra länken:

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

Koden körs bra, men alla mina försök att upptäcka den anslutna lyssnaren misslyckas:

// 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 finns här. Om du klickar på "Lägg till onclick för 2" och sedan på "[länk 2]", triggas händelsen korrekt, men "Test länk 2" rapporterar alltid falskt. Kan någon hjälpa till?

Svar #1

Jag gjorde något sådant:

const element = document.getElementById('div');

if (element.getAttribute('listener') !== 'true') {
     element.addEventListener('click', function (e) {
         const elementClicked = e.target;
         elementClicked.setAttribute('listener', 'true');
         console.log('event has been attached');
    });
}

Skapa ett speciellt attribut för ett element när lyssnaren är fäst och sedan kontrollera om det finns.

Svar #2

Det finns inget sätt att kontrollera om dynamiskt bifogade händelselyssnare finns eller inte.

Det enda sättet du kan se om en händelselyssnare är bifogad är genom att bifoga händelselyssnare på detta sätt:

elem.onclick = function () { console.log (1) }

Du kan sedan testa om en händelselyssnare fästes på onclick genom att returnera !!elem.onclick (eller något liknande).

Svar #3

Det jag skulle göra är att skapa en Boolean utanför din funktion som börjar som FALSE och sätts till TRUE när du kopplar händelsen. Detta skulle fungera som en sorts flagga för dig innan du kopplar händelsen igen. Här är ett exempel på idén.

// 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);
 }
}

Svar #4

Möjlig dubblett: Kontrollera om ett element har en händelselyssnare på sig. Ingen jQuery Vänligen hitta mitt svar där.

I princip här är tricket för Chromium (Chrome)-webbläsaren:

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

Relaterade artiklar