Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to prevent child from affecting the parent

How to prevent the CHILD element from affecting the PARENT element?

jQuery:

$("#parent").click(function() {
    alert('parent clicked');
});
$("#child").click(function() {
    alert('child clicked');
});

HTML:

<div id="parent">
    click me - parent
    <div id="child">click me - child</div>
</div>

If you click the child, the parent is also activated and we have two alerts.

So how can I prevent the child from affecting the parent?

like image 343
David Avatar asked Feb 13 '12 19:02

David


People also ask

How can I prevent my child from seeing the other parent?

Later, this parent can go to court and ask for an order to prevent the other parent from seeing the children or limiting visits. a drastic decision is necessary to protect the interests of the children. A judge will carefully evaluate a decision to prevent children from seeing one of their parents.

How to deal with a narcissistic parent?

When a child watches a narcissistic parent always blame other people, it can be an easy hole to fall into. Don't let your child make the same mistake. 7. Practice consistency. Narcissistic parents and their households are notoriously inconsistent.

Can a judge prevent a child from seeing one of their parents?

a drastic decision is necessary to protect the interests of the children. A judge will carefully evaluate a decision to prevent children from seeing one of their parents. If possible, the judge will opt for something less extreme, such as supervised contact.

How can you prevent sexual abuse in your child?

Rosenzweig and Katelyn Brewer, CEO of the child sexual abuse prevention organization, Darkness to Light, offer this advice: 1. Talk to your kids about sex, early and often.


2 Answers

event.stopPropagation()

$("#child").click(function(event) {

    event.stopPropagation();

    alert('child clicked');
});

Calling event.stopPropagation() will stop the event from bubbling up the DOM tree.

like image 144
Craig Avatar answered Oct 23 '22 12:10

Craig


This is called event bubbling or event propagation. This can be prevented by adding e.stopPropagation() in your code. If you also want to stop the default behavior you can simply do: return false;.

return false; basically does both: e.stopPropagation() and e.preventDefault(). Which can be useful if you are using <a> tags for example and you want to prevent the page navigating away after a click.

like image 37
PeeHaa Avatar answered Oct 23 '22 14:10

PeeHaa