473,386 Members | 1,621 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

Seperating overlapping elements events

bugboy
160 100+
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
5 3725
acoder
16,027 Expert Mod 8TB
Use stopPropagation() or cancelBubble=true to cancel it. See Event order.
Dec 1 '08 #2
bugboy
160 100+
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
16,027 Expert Mod 8TB
See Event Propagation Example
Dec 2 '08 #4
bugboy
160 100+
Thanks!
Kind regards,
Bugboy
Dec 2 '08 #5
acoder
16,027 Expert Mod 8TB
You're welcome. Remember to add cancelBubble in there for IE.
Dec 2 '08 #6

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

Similar topics

11
by: Max M | last post by:
I am writing a "find-free-time" function for a calendar. There are a lot of time spans with start end times, some overlapping, some not. To find the free time spans, I first need to convert the...
5
by: Richard Cornford | last post by:
I am interested in hearing opinions on the semantic meaning of FORM (elements) in HTML. I have to start of apologising because this question arose in a context that is not applicable to the...
2
by: Kalvin | last post by:
I am very new to CSS and am trying to set up 2 divs in the same space on the page. The idea is that div1 will be an informational message only displayed sometimes. When there isn't a message to...
7
by: mittal.pradeep | last post by:
What is the better table design for a data collection application. 1. Vertical model (pk, attributeName, AttributeValue) 2. Custom columns (pk, custom1, custom2, custom3...custom50) Since the...
3
by: Harry Whitehouse | last post by:
I've put up a few simple ASPX pages and they seem to display fine on all of the IE versions in my office, but periodically I hear from a remote user that the various text elements (distinct...
5
by: Gernot Frisch | last post by:
Hi, I have a site: http://www.glbasic.com/bugs.htm where 2 divs (class = "outer") overlap in Firefox. In IE it looks good (although the text part has a too large distance from the header...)...
7
by: mavigozler | last post by:
IE7 does not appear to set an event on contained text inside SPAN elements whose 'onclick', 'onmouseover', and 'onmouseout' events, defying the HTML recommendation. Firefox appears to conform. ...
62
by: Wiretwisterz | last post by:
I am using Microsoft Office XP and I have developed an Access database that is used to schedule conference and training rooms within buildings. I have one main form named "Events" that is used to...
25
bugboy
by: bugboy | last post by:
I'm trying to find a cross browser solution for editing text in a flickr photo caption manor where the text is displayed in a <div> or <a> tag but changes to a <textarea> via JS when clicked. ...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.