In der Vergangenheit habe ich JQuery's Bindung direkt an Ereignisse verwendet. Zu diesem Zeitpunkt habe ich jedoch keine DOM -Elemente dynamisch generiert, sondern die DOM -Elemente, die ursprünglich auf der Seite für die Ereignisbindung existierten. Kürzlich, als ich das dynamisch generierte DOM -Bindungsereignis getestet habe, stellte ich fest, dass das Ereignis ungültig war, also habe ich es getestet:
1. Ursachen für das Versagen des Ereignisses:
(1) Die Bindungsereignisbindung gilt nur für Elemente, die in der DOM vorhanden sind. Es kann nicht auf Elemente überwacht werden, die wir später dynamisch hinzufügen, daher kann es nicht gebunden werden.
(2) In ähnlicher Weise, wenn Sie var aa = document.getElementsByTagName ("Dynamic generiertes Element") verwenden; Um dynamisch generierte Elemente zu erhalten, da die Webseite nur einmal eine Initialisierungsbindung durchführt und die dynamisch erzeugten DOM -Elemente danach nicht überwacht werden können.
2. Lösung:
(1) Binden Sie mehr Ereignisse an jedem dynamisch erzeugten Ort, wie zum Beispiel das Beispiel in diesem Blog
.
(3) Veränderung an Delegierter, da der Delegate in Echtzeit überwacht wird.
(4) In Jquery1.7 wurden die Methoden Bind (), Live () und Delegate () durch ON ersetzt.
3.. In Bezug auf die Gründe für den jüngsten Ereignisfehler: Auf der ursprünglichen Webseite (der Code ist unter https://github.com/ufowl/ife/tree/master/stage02/task16 zu sehen), möchte ich die dynamisch generierte Dynamik des Löschens des Löschens des Löschens des Löschens. Die Delete -Ereignis wird dynamisch generiert, um die Delete -Taste zu löschen, aber das Delete -Ereignis ist ungültig, da das Delete dynamisch generiert ist. Bei der Initialisierung der Ereignisbindung ist die Taste in der erhaltenen Tabelle bereits leer, sodass die gebundenen Elemente immer leer sind, sodass beim Klicken auf die Schaltfläche Schaltfläche keine Antwort ist.
4. Die endgültige Lösung: Erhalten Sie zuerst die Tabelle, binden Sie dann das Klickereignis der Tabelle (da sich die Tabelle im DOM -Element befindet, das bereits vorhanden ist), und erfassen Sie dann das Ziel des Ereignisses (z. B. klicken Sie auf die Taste in der Tabelle. Zu diesem Zeitpunkt wird die Taste dynamisch generiert und fügt sie in die Tabelle an.
HINWEIS: Hier werden zwei Probleme festgestellt:
(1) Die Elemente in der Tabelle wurden der Tabelle hinzugefügt. Wenn Sie also auf diese Schaltfläche klicken, erhalten Sie die, die Sie erhalten.
(2) Warum wurden die Tasten in die Tabelle hinzugefügt, aber sie kann immer noch nicht erhalten werden? Da die Schaltflächen in der Tabelle erhalten werden, wenn die Init () -Funktion initialisiert wird, wurde jedoch zu diesem Zeitpunkt keine Operation durchgeführt, sodass das, was erhalten wird, leer ist, sodass keine Elemente gebunden sind.
Die beiden oben genannten Probleme müssen deutlich unterschieden werden, und dies ist der Schlüssel zum Problem.
5. Über Bindung: Nach jedem Bindungsereignis wird das Ereignis gebunden. Unbind und dann wiederherstellen, sonst wird das Ereignis immer existieren. Aus diesem Grund wird bei der Arbeit an einem Projekt manchmal das Ergebnis der AJAX -Anfrage wie 1, 2, 4, 8 überlagert. Wenn Bind verwendet wird, wird jedes ausgelöste Ereignis an eine Operation gebunden. Wenn daher das erste Mal ausgelöst wird, wird die AJAX -Anfrage einmal angefordert. Wenn das zweite Mal ausgelöst wird, beträgt die AJAX -Anforderung 1+1 = 2 -mal; Das dritte Mal ist 1+2+1 = 4 -mal; Das vierte Mal beträgt 1+2+4+1 = 8 Mal und so weiter. Wenn Sie Bind zum Binden von Ereignissen verwenden, müssen Sie zuerst die ursprünglichen Ereignisse des Elements entbinden und dann an Ereignisse binden, damit AJAX -Anforderungen nicht mehrmals verursachen.
Der obige Artikel über die Gründe und Lösungen für das Versagen der dynamischen Erzeugung von DOM -Bindungsvorfällen ist der gesamte Inhalt des Herausgebers. Ich hoffe, es kann Ihnen eine Referenz geben und ich hoffe, Sie werden Wulin.com mehr unterstützen.