javascript - 如何在 JavaScript 中抛出 mouseEvent？

Question

我有一个包含重叠元素且绝对定位的 SVG。这些元素包含在层中(使用 SVG g)标签，因此可能并不总是具有共同的父级。

在 D3 中，元素可以响应它们捕获的单击事件。但是，重叠元素会阻止底部元素捕获任何单击事件。 (由于我的应用程序的设计，我不能任意更改它们的 DOM 顺序 - 这很重要。)我想知道是否有一种方法可以通过元素传递单击事件，同时保留拖动事件 - 几乎就像“抛出” “如果可能的话，举办事件。

由于我仍然需要拖动事件和其他指针事件，因此我无法使用“pointer-events: none”属性。此外，由于这些元素可能没有共同的祖先，因此我无法真正以这种方式循环遍历元素。

我想要的行为是切换 - 单击形状将调用该形状的单击处理程序，并选择该形状。单击选定的形状(如果它与另一个形状重叠)将调用选定形状的单击处理程序，该处理程序将“抛出”单击事件，以便将其传递到底层元素。 (也许使用诸如 d3.event.throw 或 return d3.event 之类的东西，或者类似的想法)。

这可能吗？

Answer 1

单击事件由元素的单击事件处理程序处理。因此，您要做的就是调用底层元素的单击事件处理程序。但是，如果您还想将覆盖元素的点击坐标传递给底层元素的点击事件处理程序，则必须传递它们(坐标)/它(事件)证据:

overlyingElement.onclick=function(e){
    var event=e||window.event;
    underlyingElement.click(event);
}

从未测试过，但是

我希望它在 IE 中也能正常工作。