javascript - 在重叠元素上注册鼠标事件

Question

在我的 svg 图像中，我绘制了很多路径（和其他元素），其中一些是部分透明的并且可能相互重叠。

如何确保所有元素的侦听器都接收到诸如单击之类的鼠标事件，而不仅仅是最上面的。

基本示例（假设 A、B、C 具有相同的坐标和大小）：

<g id="parent">
  <rect id="A" .../>
  <rect id="B" .../>
  <rect id="C" .../>
</g>

在此示例中，期望的结果是 A、B、C 上的侦听器注册了对矩形 C（最顶部）的单击

使用谷歌我了解到我可以通过向父级注册一个监听器然后检查受影响的子元素来自己调度事件但是我想知道是否有更好的解决方案或库。

score 1 · Accepted Answer

使用 jquery++，您可以找到哪些元素位于给定位置，即使它们位于其他元素之后，您可以执行以下简单操作：

$("#parent").on("click",function(ev){
    $(this).children().within(ev.offsetX,ev.offsetY)...; //filter the elements
});

1 回答 1