Question

我在SVG元素上设置了.click()事件。当我在Internet Explorer 11中单击它时，它认为我点击了背景元素。我尝试过使用z-index，但没有运气。我使用它来记录它认为我试图点击的元素：

$(document).click(function(e){
    console.log(e.target)
})

这里涉及很多代码，所以我只是链接到我在CodePen中的项目：

如果你将鼠标悬停在＆＃34; F＆＃34;或＆＃34; C＆＃34;在温度的右侧，它应该变白。点击后，温度应从摄氏度变为华氏度。这些都不适用于IE 11岁的石器。

在Chrome和Firefox中运行得很好（毫不奇怪）

我的猜测是窃取焦点并阻止上述工作。如果你足够快，可以在刷新页面后立即在IE中使用它。

干杯

Answer 1

我必须事先通知，因为以下更多是一般性评论而不是答案。但我认为值得警惕，因为你会遇到更多问题。

使用jQuery来操作SVG并不是最好的选择。以防万一：

$('.weather-degfht-indicator').animate({
    cx: cx,
    cy: cy
},500)

在Firefox和IE中，这会导致尝试更改圆形元素的cx / cy 属性，这是一个只读SVGAnimatedLength。在Firefox中，changeDegFht函数似乎进入无限循环，在IE中可能会导致无法恢复的错误（没有对其进行测试）。

可写属性为SVGCircleElement.cx.baseVal，jQuery不知道。

在Chrome中它可以正常运行，但只是顺带一提，因为cx已经作为CSS属性（即将发布的SVG 2 spec的一部分）实现，SVGCircleElement.style.cx属性存在且可写。

关于HTML和SVG以及SVG实现怪癖之间差异的所有这些缺陷都是jQuery所不知道的，我预计由于这些问题会导致更多事情无法正常工作，有些问题也会出现在Chrome中。（例如，您无法从SVG名称空间创建新元素，因为jQuery无法使用.createElementNS()方法。）

我认真考虑建议您使用SVG感知框架。但后来我知道它会使很多工作无效，可能不是一个现实的选择。