如何使嵌入在 HTML 文件中的 svg 图像的每个元素(例如带有某些类的圆圈等)成为事件链接? 我需要一个代表某些元素的 svg 图像,它们应该是可点击的链接。
那是SVG图像的片段:
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="612px" height="792px" viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
<a href="http://google.com" ><rect x="-124.203" y="112.232" fill="#E88324" stroke="#000000" stroke-miterlimit="10" width="175.362" height="226.087"/> </a>
我制作了第二个 div:
<div class="displayer" style=" width:100%; height: 100%;">
</div>
并尝试使用 jQuery 来做到这一点:
$(document).ready( function () {
$("a").click(function() {
// $("body").hide();
$(".displayer").load("http://google.com");
});
});
但是没有意义,你会怎么做呢?
最佳答案
尝试一下,在fiddle中测试
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="612px" height="792px" viewBox="0 0 612 792"
enable-background="new 0 0 612 792" xml:space="preserve">
<a xlink:href="http://google.com">
<rect x="-124.203" y="112.232" fill="#E88324"
stroke="#000000" stroke-miterlimit="10"
width="175.362" height="226.087"/> </a>
</svg>
你只是忘记了 xlink:href
在<a>
里面svg
关于javascript - 如何使 SVG 元素成为链接?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29628381/