Résumé détaillé de js bouillonnant, capturant des événements et empêchant le bouillonnement des méthodes_javascript skills

Il existe des problèmes de diffusion d'événements et de capture d'événements dans les événements JavaScript et jquery. Les deux problèmes et leurs solutions sont résumés en détail ci-dessous.

Le bouillonnement d'événements est un processus de bouillonnement des nœuds enfants aux nœuds ancêtres ;

La capture d'événements est tout le contraire, un processus des nœuds ancêtres aux nœuds enfants.

Donnez un exemple d'événement de clic jquery :

Le code est le suivant :

Copier le code Codez comme suit :

>
>

moi
cliquez


Phénomène de bouillonnement d'événement : cliquez sur le bouton avec "id=clickMe", et deux boîtes pop-up "bonjour" et "bébé" apparaîtront successivement.

Analyse : lorsque l'on clique sur le bouton avec "id=clickMe", l'événement de clic lié au bouton, à l'élément parent du bouton et au corps est déclenché, de sorte que deux boîtes apparaissent l'une après l'autre, provoquant ce qu'on appelle phénomène de bouillonnement.


Phénomène de capture d'événement : lorsque vous cliquez sur un div qui n'a aucun événement de clic lié et un bouton avec "id=button2", la boîte de dialogue "bébé" apparaîtra.

Dans les projets réels, nous devons empêcher la propagation et la capture d'événements.

Méthodes pour empêcher la propagation d'événements :

Méthode 1 : renvoyer false dans l'événement de clic en cours




Copier le code


Le code est le suivant :

$('#clickMe').click(function(){ alert('hello'); return false; });

Méthode 2 :




Copier le code

Le code est comme suit :

$('#clickMe').click(function(event){ alert('hello'); var e = window.event | | event; if ( e.stopPropagation ){ //Si l'objet événement est fourni, il s'agit d'un navigateur non-IE

e.stopPropagation(); //Un moyen compatible avec IE Annuler le bouillonnement d'événements

window.event.cancelBubble = true;
}
}


Il semble que la capture d'événements ne puisse pas être bloquée.

Déclaration de ce site Web

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn