如何在嵌入式SVG文件中打开链接在主窗口中打开,而不是在单独的对象中打开

时间:2011-08-10 09:10:26

标签: html svg

我有一个包含URL链接的SVG文件(由Graphviz生成)。我希望这些链接可以点击。首先我试过

<img src="path/to/my.svg"/>

显示图像正常但链接不可点击。更改为对象:

 <object data="/path/to/my.svg" type="image/svg+xml">

使链接可以点击,但当用户点击它们时,新页面会在对象内打开。有什么方法可以在主窗口中打开链接吗?

这是使用firefox 5.0,但如果你知道有任何跨浏览器的差异,我会很感激警告!

1 个答案:

答案 0 :(得分:39)

首先,如果您将SVG嵌入<img>,浏览器将无法打开链接,也不会在<img>内运行脚本,因为您嵌入了一个图像,很可能是您的图片可能会显示在<a>内,并且您无法将链接放在链接中。

要在新标签页中打开链接,您可以使用target属性(如HTML)或xlink特定的xlink:show属性(值new)。 SVG规范says以下内容:

  

[xlink:show]属性用于向后兼容SVG 1.1。它为支持XLink的处理器提供文档。在发生冲突的情况下,目标属性具有优先级,因为它可以表达更宽范围的值。

target属性的值可以是:

  • _replace
  • _self
  • _parent
  • _top
  • _blank

因此,在您的SVG中,您需要编写如下:

<a xlink:href="http://example.com" target="_blank">[...]</a>

但目前所有能够显示SVG的浏览器都支持xlink:showtarget属性(我还没有在IE9中测试过)。