ansaurus

Question

Howto: div with onclick inside another div with onclick javascript

Answer 1

+2 A:

return false; from the inner div's onclick function:

<div onclick="alert('inner'); return false;" ...

What you're dealing with is called event propagation.

Tatu Ulmanen 2010-03-05 07:17:26

The method you suggest doesn't actually work. (At least not in any of the browsers I just double checked it on-- Firefox 3.6, IE8.) Note that your link actually says to use a different method, which I gave in my answer.

Tim Goodman 2010-03-05 07:37:57

Answer 2

+3 A:

Check out the info on event propagation here

In particular you'll want some code like this in your event handlers to stop events from propagating:

function myClickHandler(e)
{
    // Here you'll do whatever you want to happen when they click

    // now this part stops the click from propagating
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
}

Tim Goodman 2010-03-05 07:18:09

Answer 3

A:

This is a case of event bubbling.

You can use

e.cancelBubble = true; //IE

and

e.stopPropagation(); //FF

rahul 2010-03-05 07:21:39

took me a while to understand, but got it now, thx

Daniel Brink 2010-03-05 07:37:41

Answer 4

+7 A:

Basically there are two event models in javascript. Event capturing and Event bubbling. In event bubbling, if you click on inside div, the inside div click event fired first and then the outer div click fired. while in event capturing, first the outer div event fired and than the inner div event fired. To stop event propagation, use this code in your click method.

   if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();

Adeel 2010-03-05 07:29:13

thank you, a simple clear answer and works perfectly

Daniel Brink 2010-03-05 07:37:05

Answer 5

A:

Here is some more reference to help you in understanding javascript event bubbling.

Ben 2010-03-05 07:33:45

Answer 6

A:

you have two 'div' and three '/div'.

freddie 2010-07-24 16:27:20

ansaurus

tags:

views:

answers:

Howto: div with onclick inside another div with onclick javascript

related questions