javascript - SVG 中的事件捕获

标签 javascript events svg dom-events

我正在 try catch SVG 元素(在本例中为矩形)上触发的事件。但是,事件无法识别,我收到控制台错误:

ReferenceError: event is not defined.

我在 HTML 元素上调用了相同的函数,并且运行良好。是否有任何原因导致以下内容不适用于 SVG 元素?

这是代码:

<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)"/>
</g>

Javascript:

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

编辑: 根据评论,这似乎是 Firefox 问题,有解决办法吗?它似乎可以在 Chrome 中运行。感谢 jessh 的提示。

最佳答案

将事件更改为 evt 以生成以下内容:

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

关于javascript - SVG 中的事件捕获,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38885289/

相关文章:

javascript - 数据变量未从 VueJS 中的方法更新

android - 触摸事件不能很好地从子级发送到父级 - 添加源代码

javascript - 监听窗口事件或将对象附加到窗口

javascript - 累积填充svg并进行后续计算

javascript - 即时调整形状大小

javascript - 如何检查 A 标签是否环绕 IMG 元素?

javascript 复制div 更改innerHTML id

javascript - 在 D3 中对 SVG 元素进行分组

javascript - 有没有办法在离开文档正文时触发 mouseup?

css - 如何使 SVG 图不截断溢出的形状?