Reputation: 35
Hello my friends so this is my question i have two divs, one of them is inside of the other one like this schema below.
<div class="button1" onclick={buttonOnePressed}>
<div class="button2" onclick={buttonTwoPressed}">
</div>
</div>
i Want to click on the div with class "button2" and call only one function that is the "buttonTwoPressed". But when i click on the div "button2" i accidentally also call the function "buttonOnePressed", so this way two functions are called but i just wish one. What can i do to prevent that ? Thank you for reading
Upvotes: 3
Views: 814
Reputation: 20616
Event bubbles up. Use .stopPropagation() to stop it from moving to parent.
let buttonTwoPressed = (event) =>{
event.stopPropagation();
}
Upvotes: 5