Einführung in den Unterschied zwischen Bindungs- und Live-Bindungsereignissen in Jquery

Jquery Es gibt drei Möglichkeiten, das -Ereignis zu binden: Nehmen Sie das Klickereignis als Beispiel

(1) target.click (function(){});

(2) target.bind("click",function(){});

(3) target.live("click",function(){});

Die erste Methode ist in der Tat leicht zu verstehen von gewöhnlichem JS, aber mit weniger Nur einem

Die zweite und dritte Methode sind alle Bindungsereignisse, aber sie sind sehr unterschiedlich, denn wenn Sie Jquery verwendenFramework wird häufig verwendet, daher sollten Sie besonders auf den Unterschied zwischen den beiden achten.

[Der Unterschied zwischen Bind und Live]

Die Live-Methode ist eigentlich eine Variante der Bind-Methode. Ihre Grundfunktion ist dieselbe Auf die gleiche Weise wird ein Ereignis an ein Element gebunden, aber die Bindungsmethode kann Ereignisse nur an aktuell vorhandene Elemente binden und ist für neu generierte Elemente, die JS oder andere Methoden verwenden, ungültig Die Nachteile der Bind-Methode können durch diesen Defekt auch an später generierte Elemente gebunden werden. Wie wird diese Funktion der Live-Methode implementiert? Lassen Sie uns unten das Implementierungsprinzip besprechen.

Der Grund, warum die Live-Methode auch entsprechende Ereignisse an die später generierten Elemente binden kann, wird dem „Event-Delegierten “ zugeschrieben Die sogenannte „Ereignisdelegation“ bedeutet, dass an Vorgängerelemente gebundene Ereignisse auf Nachkommenelemente angewendet werden können. Der Verarbeitungsmechanismus der Live-Methode besteht darin, das Ereignis an den Wurzelknoten des DOM-Baums zu binden, anstatt es direkt an ein Element zu binden. Geben Sie ein Beispiel zur Veranschaulichung:

   $(".clickMe").live("click",fn);
             $("body").append("<p class=&#39;clickMe&#39;>测试live方法的步骤</p>");

Wenn wir darauf klicken , um ein hinzuzufügen Element Die folgenden Schritte werden nacheinander ausgeführt:

(1) Ein Klickereignis generieren und es zur Verarbeitung an p übergeben

(2) Da es kein Ereignis gibt, ist es direkt an p gebunden, sodass das Ereignis direkt in den DOM-Baum sprudelt

(3) Das Ereignis sprudelt weiter bis zum Wurzelknoten des DOM-Baums. Standardmäßig ist die Wurzel Das Klickereignis

ist an den Knoten gebunden (4) Führen Sie das durch Live gebundene Klickereignis aus

(5) Erkennen Sie die Bindung. Überprüfen Sie, ob das -Objekt des Ereignisses vorhanden ist, und bestimmen Sie, ob das gebundene Ereignis weiterhin ausgeführt werden muss. Das Erkennen von Ereignisobjekten erfolgt durch Erkennen, ob $(event.target).closest('.clickMe') passende Elemente finden kann.

(6) Nachdem der Test von (5) bestanden wurde und das an das Ereignis gebundene Objekt existiert, wird das gebundene Ereignis ausgeführt.

 

Da die Live-Methode nur dann erkennt, ob das an das Ereignis gebundene Objekt existiert, wenn das Ereignis eintritt, kann die Live-Methode später hinzugefügte Elemente auch implementieren. Die Ereignisbindung kann dies auch umgesetzt werden. Im Gegensatz dazu bestimmt bind, ob das Element, an das das Ereignis gebunden ist, während der Bindungsphase des Ereignisses vorhanden ist, und bindet nur an das aktuelle Element, nicht an den übergeordneten Knoten.

Laut der obigen Analyse sind die Vorteile von Live wirklich groß. Warum sollten wir also die Bindungsmethode verwenden? Der Grund, warum JQuery die Bindungsmethode beibehält, anstatt die Live-Methode zum Ersetzen von Bindung zu verwenden, liegt darin, dass Live in einigen Fällen die Bindung nicht vollständig ersetzen kann.

Die Hauptunterschiede

sind wie folgt: (1) Die Bindemethode kann jedes JavaScript

-Ereignis binden, while live In jQuery 1.3 unterstützt die Methode nur click, dblclick, keydown, keypress,

keyup,Mousedown, Mousemove, Mouseout, Mouseover und Mouseup werden sogar Focus und Blue unterstützt

Ereignis (zugeordnet zu Focusin und Focusout, die besser geeignet sind und Blasen verursachen können). Darüber hinaus wird in jQuery 1.4.1 auch Hover unterstützt (Zuordnung von

zu „mouseenter mouseleave“).

(2) live() unterstützt Elemente, die durch DOM-Traversal gefunden werden, nicht vollständig. Stattdessen sollten Sie die Methode .live()

immer direkt nach einem Selektor verwenden.

(3) Wenn ein Element die Live-Methode zum Binden von Ereignissen verwendet und Sie verhindern möchten, dass das Ereignis übermittelt wird oder sprudelt, müssen Sie in der Funktion false zurückgeben und einfach

Die Verwendung von stopPropagation() kann die Zustellung oder das Sprudeln von Ereignissen nicht verhindern

Das obige ist der detaillierte Inhalt vonEinführung in den Unterschied zwischen Bindungs- und Live-Bindungsereignissen in Jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!