EventListener lässt sich nicht setzen.

  • JavaScript

Es gibt 2 Antworten in diesem Thema. Der letzte Beitrag () ist von Fakiz.

    EventListener lässt sich nicht setzen.

    Guten Tag, ich möchte nach dem die Seite geladen ist für meherere Elemente einen Click-EventListener setzen. Das mache ich wie folgt:

    Quellcode

    1. window.addEventListener('load', async () => {
    2. await new Promise((resolve) => {
    3. const navigationElements = document.querySelectorAll('[data-url]');
    4. navigationElements?.forEach(item => {
    6. // Funktioniert
    7. item.setAttribute('onclick', 'console.log("inline item clicked")');
    9. // Funktioniert nicht
    10. item.addEventListener('click', () => { console.log("item clicked") });
    11. });
    12. resolve(true);
    13. });
    14. });


    Die Inline Variante funktioniert, die Variante über die addEventListener Funktion leider nicht. Hat das Problem schon mal jemand gehabt und weiß eventuell an was das liegen könnte?

    @Fakiz also bei mir funktioniert dieses Beispiel. Entsprechend finde ich in der Konsole beim Klicken auf das Element auch die beiden Ausgabezeilen. Vielleicht ne blöde Frage, aber hat dein Element auch sicher ein data-url Attribut? Entweder das, oder ein anderer Listener pfuscht dir mit sowas wie preventDefault() oder stopPropagation() dazwischen.

    Link :thumbup:
    Hello World

    Dieser Beitrag wurde bereits 4 mal editiert, zuletzt von „Link“ ()

    aber hat dein Element auch sicher ein data-url Attribut?

    Ja in der NodeList navigationElements befinden sich alle erwarteten Elemente. preventDefault() und stopPropagation() kann ich ausschließen da den Elementen kein EventListener hinzugefügt wird.

    Hab das Problem gefunden, es gibt 3 Asynchrone Window.Load EventListener, 2 davon importieren dynamisch Skripte. Nimmt man einen der EventListener, die dynamische Imports beherbergen, raus klapp alles. Vorerst nutze ich jetzt das DOMContentLoaded Event da es damit keine Probleme gibt.

    *Edit*
    Nach dem ich mir das ganze nochmal genauer angesehen habe ist mir aufgefallen das in einer der importierten Klassen ein HTML string mittels += dem Document.Body hinzugefügt wurde.

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von „Fakiz“ ()

Facebook
Telefonspende