stopPropagation() et firefox

Version imprimable

Bonjour,

J'ai deux div imbriquée avec chacune un évènement onClick différent le problème c'est que lorsque l’on clique sur la div la plus au dessus les deux fonction de chaque div sont exécutées j'ai donc trouvé la solution stopPropagation() te cancelBubble qui fontionne très bien pour tout les autres navigateurs mais impossible de le faire fonctionner sur firefox!!

Mon code :
Code:

1 2 3 4 5 6 7 8 function modifier_produit(){ alert('modifier'); if (event.stopPropagation){ event.stopPropagation(); } event.cancelBubble = true; }
Merci de votre aide

Bonjour,
- FireFox n'implémente pas d'objet event, particularité de IExplorer, il te faut passer event en paramètre à la fonction au minimum.
Code:

1 2 3 4 5 6 7 8 9 10 11 function CancelEvent(e){ if( e){ e.stopPropagation(); e.preventDefault(); } if( window.event){ window.event.cancelBubble = true; window.event.returnValue = false; return; } }
- stopPropagation est W3C et cancelBubble IE.
Une page très instructive Présentation des évènements du DOM

Merci mais je n'arrive pas a le faire fonctionner, j'ai fait comme ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
function modifier_produit(e){
        alert('modifier');
  if( e){
    e.stopPropagation();
    e.preventDefault();
  }
  if( window.event){
    window.event.cancelBubble = true;
    window.event.returnValue  = false;
    return;
  }
}

et mon code qui appel la fonction est :

Code:

1
2
 
echo'<div class="modifier"><img src="logo/modify.png" onMouseOver="change_modifier(this.id)" onMouseOut="remet_modifier(this.id)" onClick="modifier_produit()" id="modif'.$resultat->id.'" class="bouton_modif"></div>';

Mais la fonction de la div du dessous est toujours appelée!

11/05/2011, 20h28
Invité

Code:

onClick="modifier_produit(event)"

en complément de ce qu'a écrit mekal tu ne peux pas faire l'appel en direct dans la balise et utiliser le e en direct.
Il te faut dans ce cas tester l'existence de la méthode.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function modifier_produit(e){
  var sMsg = e.stopPropagation ? "W3C" : "IExplorer";
  alert( sMsg);
 
  // stop la propagation
  if( e.stopPropagation){
    e.stopPropagation();
    e.preventDefault();
  }
  if( window.event){
    window.event.cancelBubble = true;
    window.event.returnValue  = false;
    return;
  }
}

testes avec

Code:

1
2
3
4
5
6
7
8
<div class = "modifier" onclick = "alert( this.tagName);">
  <img src = "logo/modify.png"
    id = "modif"
    class = "bouton_modif"
    onmouseover = "change_modifier(this.id)"
    onmouseout = "remet_modifier(this.id)"
    onclick = "modifier_produit(event);">
</div>

par exemple

11/05/2011, 21h14
Auteur

Je déterre de vieilles discussions :D
http://www.developpez.net/forums/d68...oppropagation/

http://www.developpez.net/forums/d57...circuiter-1-a/
12/05/2011, 10h30
nclsbiz

Ca fonctionne enfin !

Un grand merci a vous