Question

I have a table cell (td) that triggers a script when clicked. I have a div within that table cell that triggers another div when clicked. I have successfully used the code below to cancel event bubbling (so the div event doesn’t trigger the td event).

if (!e) var e = window.event;

e.cancelBubble = true;
e.stopImmediatePropagation();
e.returnValue = false;

if (e.stopPropagation)
{
    e.stopImmediatePropagation();
    e.stopPropagation();
    e.preventDefault(); 
}

Everything works as it should in Chrome, Safari, and Opera. Why doesn’t it prevent event bubbling in Firefox? Is there some kind of Firefox fix that I need to be aware of?

Answer 1

I think event.stopImmediatePropagation() stops other listeners from the same event to be called thus making event.stopPropagation() call after ineffective. Try using just event.stopPropagation().