Ausführliche Erläuterung der korrekten Methode zum Abbrechen und Binden von JQuery-Hover-Ereignissen

Im Webdesign verwenden wir häufig jquery, um auf das Mouse-Hover-Ereignis zu reagieren, das den gleichen Effekt hat wie Mouseover- und Mouseout-Ereignisse . Aber wie kann man on verwenden, um die Hover-Methode zu binden? Wie verwende ich „off“, um das gebundene Ereignis abzubrechen?
1. So binden Sie das Hover-Ereignis
Schauen Sie sich zunächst den folgenden Code an: Angenommen, wir binden ein Click-and-Hover-Ereignis an das Tag a:

$(document).ready(function(){ $('a').on({ hover: function(e) { 
 //Hover event handler 
alert("hover"); },
 click: function(e) { // Click event handler
alert("click"); } }); 
});

Wenn auf ein Tag geklickt wird, passiert etwas Seltsames. Das gebundene Hover-Ereignis reagiert überhaupt nicht, aber das gebundene Klick-Ereignis reagiert normal.

Aber wenn Sie die Schreibweise ändern, zum Beispiel:

$("a").hover(function(){ alert('mouseover'); }, function(){
alert('mouseout'); })

Stattdessen sollten die beiden Ereignisse „mouseenter“ und „mouseleave“ verwendet werden (dies ist auch das Ereignis, das in der .hover() -Funktion verwendet wird)
, damit Sie direkt auf verweisen können:
wie Dies

$(document).ready(function(){ $('a').on({ mouseenter: function(e) {
//Hover event handler 
alert("mouseover"); }, mouseleave: function(e) {
 //Hover event handler 
alert("mouseout"); }, click: function(e) { 
// Clickevent handler 
alert("click"); } }); 
});

Da .hover() ein von jQuery selbst definiertes Ereignis ist, dient es nur der Bequemlichkeit der Benutzer, Mouseenter- und Mouseleave-Ereignisse zu binden und aufzurufen. Es ist kein echtes Ereignis, daher kann es natürlich nicht als Ereignisparameter in .on() aufgerufen werden.
2. So brechen Sie das Hover-Ereignis ab
Wie wir alle wissen, können Sie das gebundene Ereignis mit der Off-Funktion abbrechen, aber Sie können das gebundene Ereignis nur über bind abbrechen. Das Hover-Ereignis in jquery ist etwas ganz Besonderes . Wenn Sie auf diese Weise gebundene Veranstaltungen bestehen, können sie nicht storniert werden.

$("a").hover(function(){ alert('mouseover'); }, function(){
alert('mouseout'); })

Der richtige Weg, ein gebundenes Hover-Ereignis abzubrechen:

$('a').off('mouseenter').unbind('mouseleave');

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der korrekten Methode zum Abbrechen und Binden von JQuery-Hover-Ereignissen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!