By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,576 Members | 1,399 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,576 IT Pros & Developers. It's quick & easy.

Seperating overlapping elements events

bugboy
100+
P: 160
Hi I have a <div> with an onclick event, inside the <div> i have an <a> element for text. What i'm trying to do is seperate their events so that when i click the text of the <a> element the parent <div> is not triggered as well, but when i click off of the <a> and on the <div> it is triggered. I think this may be called bubbling but i can't figure out how to control it.

Thanks!

Expand|Select|Wrap|Line Numbers
  1. <div  onclick="some_event">
  2.      <a  onclick="some_other_event">
  3.          Clickable text
  4.      </a>
  5. </div>
Dec 1 '08 #1
Share this Question
Share on Google+
5 Replies


acoder
Expert Mod 15k+
P: 16,027
Use stopPropagation() or cancelBubble=true to cancel it. See Event order.
Dec 1 '08 #2

bugboy
100+
P: 160
Thanks for your help. I'm new at this and after reading the link you've suggested i realize that i am using an old inline event handler way of doing things.. before i get more advanced i really want to understand what i'm doing here.. which i don't. where would i use your suggestions? do i put them in the html event handler with my function inside? or appended after the function call... i'm very confused by js at the moment..

Thanks,
Kind regards,
Dec 2 '08 #3

acoder
Expert Mod 15k+
P: 16,027

bugboy
100+
P: 160
Thanks!
Kind regards,
Bugboy
Dec 2 '08 #5

acoder
Expert Mod 15k+
P: 16,027
You're welcome. Remember to add cancelBubble in there for IE.
Dec 2 '08 #6

Post your reply

Sign in to post your reply or Sign up for a free account.