Discussion :

[nclsbiz]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[NoSmoking]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[nclsbiz]

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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!

[Invité]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onClick="modifier_produit(event)"

[NoSmoking]

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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

[Auteur]

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

http://www.developpez.net/forums/d57...circuiter-1-a/

[nclsbiz]

Ca fonctionne enfin !

Un grand merci a vous