Événements javascript onmousedown imbriqués

Question

Je souhaite différents événements onmousedown imbriqués. Par exemple, considérez le code suivant:

<div id="parent" onmousedown="foo();"> 
    <div id="child1"> </div> 
    <div id="child2"> </div> 
    <div id="child3" onmousedown="bar();"> </div> 
</div> 

J'aimerais tellement que cliquer sur une zone qui est à l'intérieur du parent div, y compris child1 et child2, entraînerait foo() appelé, et si child3 est cliqué alors bar() doit être appelée à la place.

Mes tentatives jusqu'à présent ont montré que l'exemple ci-dessus appelait foo() lorsque l'on clique sur child3, ce qui n'est pas ce que je veux.

Answer 1

<script type="text/javascript"> 

function bar(evt) { 
    // Your stuff here 
    if (typeof evt.stopPropagation != "undefined") { 
    evt.stopPropagation(); 
    } else { 
    evt.cancelBubble = true; 
    } 
} 

</script> 

<div id="parent" onmousedown="foo();"> 
    <div id="child1"> </div> 
    <div id="child2"> </div> 
    <div id="child3" onmousedown="bar(event);"> </div> 
</div> 

Answer 2

Dans votre HTML:

<div id="parent" onmousedown="foo();"> 
    <div id="child1"> </div> 
    <div id="child2"> </div> 
    <div id="child3" onmousedown="bar(event);"> </div> 
</div> 

javascript

function bar(event) 
{ 
    // usual bar stuff 
    event.stopPropagation(); 
}