Comment puis-je déclencher un événement sur un élément fils sans activer l'élément parent ?

Version imprimable

Bonjour,

Voilà mon problème, j'ai un element parent eltp sur lequel j'ai un trigger click
et dans celui ci j'ai un element fils eltf2. Je veux déclencher l'évènement de eltf2 sans déclencher eltp.

html
Code:

1 2 3 4 5 6 7 8 9 <div class="eltclick" id="eltp"> <div class="eltclick" id="eltf1"> </div> <div class="othereltclick" id="eltf2"> </div> </div>
Jquery
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 $(function() { $(".eltclick").click(function(event){ /* Empeche le déclenchement de eltp quand on clique sur eltf1 */ /* ne marche pas pour eltf2 */ event.stopImmediatePropagation(); /* Code à executer */ }); /* Pas de déclenchement */ $(".othereltclick").click(function(){ alert('test'); /* Code à executer */ }); });
Je m'attends à ce que 'test' s'affiche quand je clique sur eltf2 ! Quelqu'un a une idée ?
Merci.

Pour stopper

un évènement utilise ce code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
$(function() {
	  $(".eltclick").click(function(event){
			alert('autre');
	  });
 
 
	  $(".othereltclick").click(function(e){
	     alert('test');
	     /* Code à executer */
 
	     /* stop */
	     e.stopPropagation();
	  });
	});

Bonjour.

Une autre possibilité :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
$("#eltp").click(function(){
	alert("eltp !");
});
 
$("#eltf1").click(function(){
	alert("eltf1 !");
	return false; // empêche l'action par défaut et la transmission de l'événement
});
 
$("#eltf2").click(function(){
	alert("eltf2 !");
	return false;
});

06/05/2010, 10h59
rivsc
Merci pour vos réponses j'avais plus ou moins compris le fonctionnement (return false).

Le comportement obtenu m'a induit en erreur. J'avais simplifié mon code ici, en réalité j'ajoute des éléments au DOM et donc il me fallait réinitialisé le
Code:

1 2 3 4 5 $(".othereltclick").click(function(){ alert('test'); /* Code à executer */ });
après la modification du DOM, pour que les nouveaux éléments soient pris en compte.

Merci