Réponses:
L'événement mouseleave diffère de mouseout par la façon dont il gère le bullage d'événements. Si mouseout était utilisé dans cet exemple, alors lorsque le pointeur de la souris sortait de l'élément Inner, le gestionnaire serait déclenché. Il s'agit généralement d'un comportement indésirable. L'événement mouseleave, en revanche, ne déclenche son gestionnaire que lorsque la souris quitte l'élément auquel elle est liée, pas un descendant. Ainsi, dans cet exemple, le gestionnaire est déclenché lorsque la souris quitte l'élément Outer, mais pas l'élément Inner.
Il peut y avoir des moments où mouseout
est un meilleur choix que mouseleave
.
Par exemple, disons que vous avez créé une info-bulle que vous souhaitez afficher à côté d'un élément mouseenter
. Vous utilisez setTimeout
pour empêcher l'info-bulle d'apparaître instantanément. Vous effacez le délai lors de l' mouseleave
utilisation clearTimeout
, si la souris quitte l'info-bulle ne sera pas affichée. Cela fonctionnera 99% du temps.
Mais maintenant, disons que l'élément auquel une info-bulle est attachée est un bouton avec un click
événement, et supposons également que ce bouton invite l'utilisateur avec une boîte confirm
ou alert
. L'utilisateur clique sur le bouton et les alert
incendies. L'utilisateur a appuyé dessus assez rapidement pour que votre info-bulle n'ait aucune chance de s'afficher (jusqu'à présent, tout va bien).
L'utilisateur appuie sur le alert
bouton OK de la boîte et la souris quitte l'élément. Mais comme la page du navigateur est maintenant dans un état verrouillé, aucun javascript ne se déclenchera tant que le bouton OK n'aura pas été enfoncé, ce qui signifie que votre mouseleave
événement NE SE DÉBUTERA PAS . Une fois que l'utilisateur a appuyé sur OK, l'info-bulle apparaîtra (ce qui n'est pas ce que vous vouliez).
L'utilisation mouseout
dans ce cas serait la solution appropriée car elle se déclenchera.
mouseout
dans ce cas va tirer? Le navigateur ne serait-il pas toujours verrouillé pendant mouseout
?
Documentation de l'API jQuery:
mouseout
Ce type d'événement peut causer de nombreux maux de tête en raison du bouillonnement d'événements. Par exemple, lorsque le pointeur de la souris sort de l'élément Inner dans cet exemple, un événement mouseout sera envoyé à celui-ci, puis remontera vers Outer. Cela peut déclencher le gestionnaire de mouseout lié à des moments inopportuns. Voir la discussion sur .mouseleave () pour une alternative utile.
Il en mouseleave
va de même pour un événement personnalisé, qui a été conçu pour la raison ci-dessus.
L'événement Mouseout se déclenchera lorsque la souris quitte l'élément sélectionné et également lorsque la souris quitte ses éléments enfants.
L'élément d'événement Mouseleave se déclenchera lorsque le pointeur quittera uniquement l'élément sélectionné.
Référence: W3School