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!