SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member lionking2's Avatar
    Join Date
    May 2009
    Posts
    19
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How do I prevent a click handler being triggered when a child element is clicked?

    Hi

    I have two div tags, first div is the father and the second div is son Inside the father like this

    PHP Code:
    <div id="father"
    <
    div id="son"> </div>
    </
    div
    And I've added an event (onclick) in div father like this

    PHP Code:
    <div id="father" onclick="closeFather()"
    <
    div id="son"> </div>
    </
    div
    My question is why the son inherits the father in the event.

    I want when I click on the Father div implement the event, but when i click on the son does not implement anything because it does not have any event.

  2. #2
    SitePoint Guru
    Join Date
    Apr 2006
    Posts
    802
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The child doesn't inherit the handler- the parent 'hears' any click event in its bounds, which includes its child nodes.

    You can write a handler that examines the event target or srcElement and cancels the event bubbling if the origin is not the parent element.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •