SVG无法识别指针事件：无

Question

我有一个带有透明背景图像集的顶层，并希望忽略所有指针事件。所以最初我用<div style="pointer-events"></div>设置了这个功能很好，但后来我发现IE不支持这个。

进一步阅读我发现有几个地方说IE确实支持<svg> pointer-events:none，但我无法让它工作（我之前从未使用过SVG标签，所以我可以这样做都错了）。

请看这个我希望实现的非常简化的小提琴。 http://jsfiddle.net/AGVTM/

Answer 1

根（最顶层）<svg>元素不支持pointer-events: none。这背后的原因是它可能是一个安全漏洞，您可以使用SVG覆盖Facebook赞按钮，并让点击通过，例如http://jsfiddle.net/rVxTn/

如果SVG元素不是root，那么点击应该通过。此示例应适用于IE9（未经测试）

http://jsfiddle.net/DLEsn/

但是，这并不能解决您的问题，因为您无法将HTML元素放在SVG元素中。

之前我曾经多次遇到这个问题，我不得不以不同的方式解决这个问题。我建议你用实际问题（以及可能的截图）打开一个新问题，看看如何解决这个问题。

Answer 2

根本原因

绝对定位的SVG不会将点击传播到IE9中的HTML元素。

请参阅此webkit测试用例讨论：REGRESSION(r66731): pointer-events are broken in some cases以及相应的minimal test case。 意思，有趣的是，这个bug几乎也进入了WebKit，但是及时修复了。

在IE 9的案例中，结果如下：

  

IE 9.0.8112.16421 =测试失败1：浮动;通过测试2：内联

的变通方法

请参阅此模拟pointer-events: none - How to make Internet Explorer emulate pointer-events:none?

上的StackOverflow帖子

他们特别讨论非SVG前端元素，但是将点击转发到底层元素的技术也适用于您的情况。