L'événement bouillonnant consiste à cliquer sur le nœud enfant, l'événement sera transmis vers le haut, et enfin l'événement de clic du nœud parent et du nœud ancêtre sera déclenché.
partie du code html :
Élément div externe
Élément div externe
Le code jQuery est le suivant :
Lorsque vous cliquez sur le span, les événements de clic du div et du corps seront déclenchés. Lorsque l'on clique sur le div, l'événement click du corps est déclenché.
Comment éviter que ce genre d'événement bouillonnant ne se produise ? Modifier comme suit :
Parfois, cliquer sur le bouton Soumettre aura des événements par défaut. Par exemple, passez à une autre interface. Mais s’il échoue à la vérification, il ne devrait pas sauter. À ce stade, vous pouvez empêcher le comportement par défaut en définissant event.preventDefault();. Voici un cas :
Copier le code Le code est le suivant :
partie html :
Une autre façon d'éviter le comportement par défaut consiste à renvoyer false. L'effet est le même. Le code est le suivant :
De même, l'événement bouillonnant ci-dessus peut également être géré en renvoyant false.
jQuery dispose d'une fonctionnalité de bouillonnement pour le déclenchement d'événements DOM. Parfois, profiter de cette fonctionnalité peut réduire la duplication de code, mais parfois nous ne voulons pas que les événements bouillonnent. À ce stade, il est nécessaire d'empêcher jQuery.Event de bouillonner.