Ich habe einen Div-Abschnitt, den ich dynamisch über jQuery ajax bevölkere:
%Vor%Wo Daten eine Menge verschachtelter divs mit unterschiedlichen IDs sind.
Ich habe auch einen jQuery-Code, der die divs in eine Baumansicht mit einer +/- Expand / Collapse und dynamischen Datenpopulation verwandelt:
%Vor%Das Problem ist, wenn ich die Divs in die Hauptansicht der Baumansicht einfügen, alles gut. Wenn ich den exakt gleichen Text dynamisch erstelle, habe ich ihn ja verglichen, den Expand / Collapse & Amp; dynamische Datenpopulation funktioniert nicht; Ich kann jedoch mein korrektes Div-Layout auf meiner Seite sehen.
Ich vermute, dass ich das Click-Event & amp; addClass wenn ich das mache
$ ('# Baumansicht'). append (data.d);
Aber ich kann nicht herausfinden, wie.
Wenn Sie Elemente dynamisch zum DOM hinzufügen, funktionieren vorhandene Ereignisbehandlungsroutinen, die an einen Selektor gebunden sind, nicht (z. B. click
).
Sie müssen die Funktion live
verwenden, damit Ereignisse von neu erstellten DOM-Elementen erfasst werden.
Es sollte beachtet werden ( wie es war die Kommentare von Zach L ), dass ab jQuery 1.7 live
wurde zugunsten von on
abgelehnt. Der allgemeine Hinweis ist der gleiche (Tracking dynamischer Elemente), nur der Mechanismus ( on
vs live
) hat sich geändert.
live()
ist veraltet.
Von den Dokumenten :
Verwenden Sie .on()
, um Ereignishandler anzuhängen. Benutzer älterer Versionen von jQuery sollten .delegate()
gegenüber .live()
verwenden.
Sie können delegate()
oder live()
, um Event-Handler an dynamische Elemente zu binden. In den meisten Fällen ist delegate()
die effizienteste Route, es sei denn, Sie können nicht vorhersagen, wo die dynamischen Elemente im DOM vorhanden sind.
Das Erstellen von dynamischen anklickbaren Objekten hat mich auch für einige Zeit befummelt. Ich konnte die delegate () -Funktion auch nicht ausführen. Irgendwann habe ich dieses Beispiel gefunden Ссылка
und änderte es zu
var buttonClear = $('#formResult').parent().find('#formMessage');
buttonClear.append("<input type='button' value='Clear message' id='clear'>");
$("#clear").click(function() {
// Klicken Sie hier, um auf die Aktion zu klicken
});
Das formResult ist eine Formular-ID, die sich bereits auf der Seite befindet, und formMessage ist eine dynamisch hinzugefügte Nachricht, die nach dem Übermitteln des Formulars angezeigt wird. Das Skript fügt eine Schaltfläche am Ende des Formulars hinzu, um die Nachricht zu löschen.
Tags und Links jquery