Code
Code JavaScript
//Si un objet événement est fourni, il s'agit d'un navigateur non-IE
if (e && e.stopPropagation)
//Il prend donc en charge la méthode stopPropagation() du W3C
e.stopPropagation();
autre
//Sinon, nous devons utiliser IE pour annuler le bouillonnement d'événements
window.event.cancelBubble = true;
return false;
2. Empêcher le comportement par défaut du navigateur
Code JavaScript
//Si un objet événement est fourni, il s'agit d'un navigateur non-IE
si (e && e.preventDefault)
// Bloquer les actions du navigateur par défaut (W3C)
e.preventDefault();
autre
//Comment empêcher l'action par défaut de la fonction dans IE
window.event.returnValue = faux ;
renvoie faux ;
Code
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
2<html xmlns=" http://www.w3.org/1999/xhtml " lang="gb2312">
3<tête>
4<title> Empêcher les événements JavaScript de bouillonner (cancelBubble, stopPropagation)</title>
5<meta name="keywords" content="JavaScript, bouillonnement d'événement, CancelBubble, stopPropagation" />
6<script type="text/javascript">
7fonction faireQuelque chose (obj,evt) {
8alerte(obj.id);
9var e=(evt)?evt:window.event;
10if (fenêtre.événement) {
11e.cancelBubble=true ;
12} autre {
13//e.preventDefault();
14e.stopPropagation();
15}
16}
17
18
19<corps>
20<div id="parent1" onclick="alert(this.id)" style="width:250px;background-color:jaune">
21<p>Voici le div parent1.</p>
22<div id="child1" onclick="alert(this.id)" style="width:200px;background-color:orange">
23<p>Voici l'enfant1.</p>
24</div>
25<p>Voici le div parent1.</p>
26</div>
27<br />
28<div id="parent2" onclick="alert(this.id)" style="width:250px;background-color:cyan;">
29<p>Voici le div parent2.</p>
30<div id="child2" onclick="doSomething(this,event);" style="width:200px;background-color:lightblue;">
31<p>C'est l'enfant2. Will bubble.</p>
32</div>
33<p>Voici le div parent2.</p>
34</div>
35</corps>
36