在SVG Text元素中插入HTML代碼
[英]Insert HTML code inside SVG Text element
問題描述
我有一個svg：text節點，我想在其中添加HTML代碼。 實際上，我的代碼是：
<text x="10" y="54" text-anchor="start" class="barLegend">Hello!</text>
我想要這樣的東西：
<text x="10" y="54" text-anchor="start" class="barLegend"><a href='www.gmail.com'>Gmail</a></text>
當然，我希望鏈接正常工作，但它只顯示所有HTML。
任何的想法？
4 個解決方案
解決方案1
24 已采納 2012-03-30 16:15:26
看看這里：
SVG foreignObject標記允許您將非SVG內容混合到頁面中。 例如，您可以在SVG元素的中間刪除一些HTML。
解決方案2
19 2012-03-30 16:29:49
在這種情況下，為什么不使用SVG <a>元素？ 不要忘記，href需要是xlink：href。 例如
<text x="10" y="54" text-anchor="start" class="barLegend"><a xlink:href='http://www.gmail.com'>Gmail</a></text>
僅允許SVG動畫元素，描述性元素（ <title>或<desc> ），文本內容子元素（ <tspan>或<textPath> ）或SVG <a>元素作為文本元素的子元素。
解決方案3
4 2012-03-30 16:16:05
您必須使用foreignObject標記，例如：
<foreignObject width="100" height="50"
requiredExtensions="http://example.com/SVGExtensions/EmbeddedXHTML">
<body xmlns="http://www.w3.org/1999/xhtml">
<a href='www.gmail.com'>Gmail</a>
</body>
</foreignObject>
另見http://www.w3.org/TR/SVG/extend.html和https://developer.mozilla.org/en/SVG/Element/foreignObject
解決方案4
2 2017-09-03 14:20:23
這里的另一個解決方案是在項目上放置一個事件並使用javascript打開目標URL ..而根本不使用該標記。
jQuery - 在 HTML 字符串的元素內插入文本
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.