event object not defined only with Firefox (IE and Chrome works) [duplicate]

Question

<a class="lnk" href="#" onclick="showItem();">
    <span data-id="27">TEST</span>
</a>

function showItem()
{
    var itid = event.target.dataset.id;
    alert(itid);
}

If you try this jsfiddle code you can see that with IE (11) and Chrome the event object is correctly evaluated, but with Firefox (32.0) you get an error (ReferenceError : event is not defined)

It's a bug of Firefox or a different event object lifecycle in IE and Chrome ? However since in IE and Chrome it's working I think it's a problem. About a workaround ?

p.s: in jsfiddle, only with firefox, code selection still having problem (after some run you cannot select code.

Answer 1

You should pass event as an argument to the function:

<a class="lnk" href="#" onclick="showItem(event);">
    <span data-id="27">TEST</span>
</a>

function showItem(e)
{
    e = e || window.event;
    var itid = e.target.dataset.id;
    alert(itid);
}

Accessing it as a global variable is an IE feature that Chrome copied, but I don't think it's standard Javascript.