CODEWITHSUNDEEP
javascriptangularjshtml
Temp O'rary
Temp O'rary

Reputation: 5828

e.preventDefault(); prevents bubbling, BUT how can we prevent capture phase from going down further to children

e.preventDefault(); prevents bubbling, BUT how can we prevent capture phase from going down further to children.

Basically, I have parent and children elements all having click events, but I want to trigger click ONLY of parent and not of the children when user clicks the child.

In following example when user clicks any a tag it should not redirect user to the href page instead should fire click event of the parentdiv element

<div id='parentdiv'>
    <a href="a.html"></a>
    <a href="b.html"></a>
    <a href="c.html"></a>
</div>

Upvotes: 1

Views: 568

Answers (2)

Whothehellisthat
Whothehellisthat

Reputation: 2152

As far as I understand it, e.preventDefault() prevents the default behaviour (submitting when clicking a submit button, following the url when clicking on a link). e.stopPropagation() stops the event from bubbling to other listeners, so maybe that's the one you want.

[MDN]

Upvotes: 3

asenovm
asenovm

Reputation: 6517

If you want only the parent to receive the touch event you can add

pointer-events: none

in the css for the children elements.

Upvotes: 2

Related Questions