Question

我在点击SVG多边形后尝试显示多个SVG路径。通过使用

，我能够获得并显示单个路径

document.getElementById(id).style.display = "block";

getElementById（）on适用于一条路径。如何让onlclick适用于多条路径？

我尝试在这里使用带有plunker的getElementsByName（id）的for循环：http://plnkr.co/edit/5u16eptq1YMSLeuVlya5?p=preview

感谢您的帮助！

Answer 1

文档中的所有id属性必须是唯一的，并且您在SVG中can't use name attributes以便离开类。

用class

替换id属性

<path class ="test-arrow" d="M 1020 290 C1020,40 825,40 765,100" style="display: none; stroke: black; stroke-width: 5px; fill: none; marker-end: url(#markerArrow);"/>
<path class ="test-arrow" d="M 960 385 C920,450 775,550 775,370" style="display: none; stroke: black; stroke-width: 5px; fill: none; marker-end: url(#markerArrow);"/>

并使用getElementsByClassName名称修复了一些事情。

这是一个更新的Plunk

Javascript onclick显示多个SVG

1 个答案: