Analyse der Unterschiede zwischen Hover, Mouseover und Mouseout in jQuery_jquery

In diesem Artikel werden die Unterschiede zwischen Hover, Mouseover und Mouseout in jQuery anhand von Beispielen analysiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Früher dachte ich, dass in JQuery die Mouseover- und Mouseout-Ereignisse tatsächlich dem Hover-Ereignis entsprechen. Es gibt keinen Unterschied zwischen den beiden, sie sollten gleich sein. Aber gestern hat mir ein Animationseffekt klar gemacht, dass die beiden nicht gleichwertig sind.

<div class="wrapper">
<div class="img"></div>
<div class="text"></div>
</div>
<div class="point"></div>

Fügen Sie dem Wrapper ein Ereignis hinzu. Wenn sich die Maus zum Wrapper bewegt, wird die Ebene mit class="point" vergrößert. Wenn Sie jedoch die Ereignisse „Mouseover“ und „Mouseout“ verwenden, wird die Punktebene größer, wenn sich die Maus zur Wrapper-Ebene bewegt. Wenn sich die Maus jedoch zwischen der Bild- und der Textebene bewegt, wird die Punktebene größer und kleiner und ändert sich ständig. . Dies ist nicht das gewünschte Ergebnis. Solange sich die Maus auf der Wrapper-Ebene befindet, unabhängig davon, ob es sich um ein Bild oder einen Text handelt, wird der Punkt größer, aber wenn sich die Maus nicht aus der Wrapper-Ebene bewegt, Die Punktebene wird nicht kleiner.

Langsam wurde die Idee klar. Wir haben das Problem gelöst, indem wir Hover anstelle von Mouseover und Mouseout verwendet haben.

Es ist wirklich übertrieben, dass wir lange gebraucht haben, um ein so einfaches Problem zu lösen. Schreiben Sie einen Artikel zum Gedenken.

Ergänzung: Später sagte mein Meister, dass es tatsächlich diesen Absatz im JQuery-Quellcode gibt:

hover: function( fnOver, fnOut ) {
 return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
}

Das heißt schweben! =Mouseover, Mouseout. Aber hover=mouseenter,mouseleave.

Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.