Kayote Kayote - 1 year ago 68
Javascript Question

Event Capture in SVG

Im trying to capture the event fired on the SVG element (rect in this case). However,

is not recognised & I get the console error :
ReferenceError: event is not defined

I called the same function on an HTML element & it worked fine. Is there any reason why the following does not work on SVG elements?

Here is the code:

<g class="piece filled" transform="translate(120, 0)">
<!-- the following 'event' within 'playerMove' gives error -->
<rect width="120" height="120" data-tile="1" onclick="playerMove(event)"/>


const playerMove = function( e ){
console.log( e );
let eTarget = e.target;

As per the comment, it appears to be a Firefox issue, is there any workaround to this? It seems to be working in Chrome. Thanks to jessh for the hint.

Answer Source

Change event to evt to produce this:

<rect width="120" height="120" data-tile="1" onclick="playerMove(evt)"/>