Ankündigung

Einklappen
Keine Ankündigung bisher.

Nachträglich eingefügtes SELECT führt kein .change() auf

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Nachträglich eingefügtes SELECT führt kein .change() auf

    Hi,

    Ich habe eine Seite die dynamisch Select-Boxen generiert. Um auf die Änderungen in den Select Boxen reagieren zu können haben alle CheckBoxen eine id='insert_'+value. Im Script höre ich dann mit

    [code
    $("[id^=insert_]").change(function()
    {
    ]
    [/code]

    auf die Änderungen. Das funktioniert auch wunderbar für alle Selects die ich dierkt beim Start der Seite erstelle. Füge ich aber nachträglich mit JS noch Select Boxen hinzu, dann wird bei deren Änderung diese Function nicht aufgerufen.

    Wie kann ich errecihen, dass ich auch deren Änderuingen mitbekomme?

    Gruß

    Claus
    Pre-Coffee-Posts sind mit Vorsicht zu geniessen!

  • #2
    Entweder du registrierst die Event-Listener nach der Erzeugung der Elemente (für die jeweiligen Elemente) oder du nutzt Event Delegation.
    [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

    Kommentar


    • #3
      Zitat von lottikarotti Beitrag anzeigen
      Entweder du registrierst die Event-Listener nach der Erzeugung der Elemente (für die jeweiligen Elemente) oder du nutzt Event Delegation.
      Hättest du da ein Beispiel oder zumindest einen Link wie man das macht? Wenn ich wüßte wie das geht hätte ich nicht gefragt.
      Pre-Coffee-Posts sind mit Vorsicht zu geniessen!

      Kommentar


      • #4
        Meine Lösung falls jemand mit Google hierauf stößt:

        Ich habe die Funktionalität aus dem change() in eine eigene Function ausgelagert und rufe diese nun aus der charge() mit ensprechenden Parametern auf. Weiterhin habe ich nach dem hinzufügen des neuen select das change Event dieser Function zugewiesen

        Code:
         
         $('#insert_'+value)[0].addEventListener("change", function() {     changeInsert(...); });
        Pre-Coffee-Posts sind mit Vorsicht zu geniessen!

        Kommentar


        • #5
          1.Treffer für "jQuery Event Delegation": Understanding Event Delegation

          [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

          Kommentar


          • #6
            Hallo,

            ja, so geht es bestimmt auch, habe ich aber selber noch nie gebraucht.

            Oder viel einfacher: Wenn Du die Elemente erzeugt hast, dann füge den onChange Handler dort ebenfalls hinzu. Das .change() hinzufügen kann auch geschehen, bevor du das betroffene Element dem DOM hinzufügst.

            Die neuen Checkboxen haben logischerweise noch keine onChange Handler, weil sie zum Zeitpunkt der Selector-Ausführung noch nicht im DOM vorhanden waren.


            MFG

            derwunner

            Kommentar

            Lädt...
            X