Javascript microsoft edge svg解决方案中的鼠标事件

我正在html页面的

标记中加载SVG文件。SVG包含带有鼠标事件的图像

onclick

，

onmouseover

和

onmouseout

。我发现在firefox和google chrome中，这些都会触发

当我使用Microsoft edge加载页面时，我发现：

• onclick

  似乎没有触发

• onmouseover

  当我将鼠标移到图像上时会多次触发（而且不止一次）

• onmouseout

  似乎也没什么作用

谷歌搜索这一问题表明，我不是唯一一个遇到微软edge问题的人，而且这个问题更为严重

---

但是对于这类问题有什么解决方法吗？

我发现对于将css设置为

{pointer events:bounding box}

的svg子元素，

bounding box

不是Edge中的css选项。我将这些元素的css更改为

---

{pointer events:visible}

用于Edge，然后像在Chrome和Firefox中一样触发我的鼠标事件。

不要将SVG加载到

元素中。把它放在页面上就可以了。好吧，尽管没有内联它是有原因的：svg很大，它在

和一些
的内部。我需要放大它与css，以适应其高度的屏幕高度，并能够改变其水平位置。在其他浏览器中，我只能以这种方式工作。也许我可以尝试你的建议作为一个特定于浏览器的解决方案，如果它在edge中起作用的话。然而，这意味着javascript方面有很多变化。也许我可以尝试用另一个标签来替换
？不太可能。要使SVG可交互，它们必须是DOM的一部分。我做了一些实验，发现
标记不是关键问题，至少不是唯一的问题。现在，我将svg加载到
标记中。这样，edge中的鼠标事件仍然不正常。@highsciguy您找到解决方法了吗？我也面临同样的问题（特定于Microsoft Edge浏览器）？