D3事件在隐藏的svg元素上触发

Question

我似乎无法找到答案,我花了一段时间才把它重新创建为独立的小提琴/笔,但我终于有了.

我正在研究使用D3绘制和操作svg图形的Vaadin应用程序.在某一点上,屏幕上有svg有visibility:hidden.

这适用于所有浏览器.

这些隐藏元素具有click和mouseover事件,这些事件在所有浏览器中都可以找到. 但是在firefox版本34中,隐藏元素仍会隐藏它们的事件(click和mouseover).

为了更好地解释:当一个按钮被隐藏时,它的鼠标悬停事件应该在它可见时才会触发.这就是它在所有浏览器中的工作方式,除了firefox 34,35 beta和36 dev版本.它在firefox 31中工作正常.

我怀疑这是D3中的一个错误,但想要第二个意见或者有人指出我的错误.值得注意的是,设置display:none元素可以在firefox 34及更高版本中运行,但我不觉得问题出在那里

我已经创建了一个演示代码的jsbin,有两个橙色图标,一个有visibility:hidden(你可能需要禁用才能看到它)如果你鼠标悬停在隐藏元素上,则没有任何反应.但是使用firefox 34,事件就会发生.这是jsBin

任何想法都是为什么它会被解雇？我猜测D3问题或firefox错误,但是我想把它修改为修复我的代码以帮助解决其他方面的问题

谢谢

Answer 1

这只是Firefox中的一个错误.如果你报告我会解决它.

给定指针事件的特定值,我们可以确切地说该元素是否应该接收事件.如果我们不知道指针事件有什么值,那么该元素可能会或可能不会接收指针事件.这就是所有规范都试图说的.这里没有歧义.

请注意,firefox错误只影响<image>元素.如果用<rect>元素替换图像,即使在Firefox中也应该看到正确的结果.