Dodinas
Dodinas

Reputation: 6805

Javascript/jQuery Click Element within Element

This is probably something quite easy to resolve, but for some reason, I can't figure it out.

I have the following HTML:

<li onclick="function_1();">
  <input type="checkbox" onclick="function_2();">
  <div onclick="function_3();">
</li>

My issue is: Whenever I click one of the child elements (either the checkbox or div), it also carries out the function from the <li> --> function_1().

How can I prevent the parent element function from being called when child element is being clicked? What is the best way to achieve this?

Thanks for the help!

Upvotes: 1

Views: 384

Answers (2)

Coin_op
Coin_op

Reputation: 10718

Alternatively you can just return false from the child elements onclick function.

Upvotes: 0

Gregoire
Gregoire

Reputation: 24832

Use the stopPropagation function

Upvotes: 3

Related Questions