javascript - 我的 SVG 元素在 Firefox Quantum 67.0 中不再可点击

Question

我有一个 SVG 文件。有些元素可以单击，单击时可以调用 JavaScript 文件中的函数。它与 Google Chrome、IE 和早期版本的 Firefox 完美配合。但我无法让它在 Firefox 67 或更高版本上运行。

我已经尝试将 onmousedown 函数更改为 onclick。我找到了一个网站来查看我的 SVG 文件。它也工作得很好。

这是一些代码:

<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
     height="106.892mm"
     viewBox="0 0 1370.4 484.8"
     width="302.154mm">
   <g fill="none" fill-rule="evenodd" stroke="black" stroke-linecap="square"
      stroke-linejoin="bevel"
      stroke-width="1">

      <g clip-path="url(#clip464)" cursor="pointer" fill="green" fill-opacity="1"
         onmousedown="parent.OpenPane('mGraph');"
         opacity="1"
         stroke="none"
         stroke-opacity="0"
         transform="matrix(1,0,0,1,392,262)">
         <path d="M0,0 L30,0 L30,32 L0,32 L0,0 z" fill-rule="evenodd" vector-effect="none"/>
      </g>
   </g>
</svg>  

edit1:您可以在此站点上找到特定的代码脚本 -> JSFiddle link ! 它可以按预期与 Google Chrome 配合使用，但不能与 Firefox v-69 配合使用。

Answer 1

您的剪辑路径不存在:clip-path="url(#clip464)"

您的示例中没有 ID 为 Clip464 的元素。

这是一个known bug但您可以通过删除无用的属性来轻松解决这个问题。