Question

Suppose I need to write an onclick handler in an attribute, like this:

<a href='#' onclick='DoSomething(); event.stopPropagation(); return false;'>
    ...</a>

I know this is bad form, but suppose for the moment that I have to use an attribute.

Unfortunately event is not defined. I tried e and that is not defined either. Is there any way to access the event object inside the attribute, or any other way to stop the event propagation?

Answer 1

Where you get the event object depends on the browser. Some (all?) IE versions put it in window.event but everyone else passes it as an argument. So, you end up having to do a silly little dance like this:

function DoSomething(event) {
    event = event || window.event;
    event.stopPropagation();
    // Do useful work.
    return false;
}

And then set up the onclick like this:

<a href="javascript:void(0)" onclick="DoSomething(event)">

I also switch to javascript:void(0) so you don’t have the usual “# interpreted as an in-page fragment” problems.