在新标签页中打开链接

Question

我创建了一个项目网站，在网站内容中有一些外部链接可以访问。当用户单击其中一个链接时，将会跳转到指定的链接并且不再停留在当前页面。

我想要的是，当用户单击链接时，在新标签页中显示链接中指定的网站。这样，用户就可以留在当前页面并在新标签页上查看其他页面。

我在互联网上搜索并找到了这个似乎有用：

function externalLinks()
{
  var anchors = document.getElementsByTagName("a");
  for (var i=0; i<anchors.length; i++)
  {
      var anchor = anchors[i];
      if(anchor.getAttribute("href"))
        anchor.target = "_blank";
  }
}
window.onload = externalLinks;

我遇到的问题是我的网站导航栏包含锚点标签。所以现在，如果用户单击导航栏上的链接，它将在新标签页中打开。我希望只有当用户单击网站内容中的链接时才会发生这种情况。因此，如果用户单击导航栏中的链接，它不应该在新标签页中打开，而应该直接带他到指定目的地。

我尝试为所有内容中的链接添加一个类并使用 getElementByClassName，但仍然没有起作用。

有人能帮我吗？

- Kakalokia

---

虽然这可能看起来是个好主意，但你不应该强制让访问者做出这样的决定 - 参见：http://www.webcredible.co.uk/user-friendly-resources/web-usability/new-browser-windows.shtml - CJM

Answer 1

---

你可以直接使用HTML：

<a target="_blank" href="YourAmazingURL">Click here for Amazing URL</a>

另一个例子：

<a target="_blank" href="http://www.google.com/">Google</a>

这利用了target属性的优势。

有关target属性的更多信息：http://www.w3schools.com/tags/att_a_target.asp 还可以参考：http://www.w3schools.com/html/html_links.asp

编辑：

对于XHTML，只需这样做：

<a href="YourAmazingURL" onclick="window.open(this.href,'_blank');return false;">Click here for Amazing URL</a>

<a href="http://www.google.com/" onclick="window.open(this.href,'_blank');return false;">Google</a>

---

- anonymous

---

问题是我只需要使用XHTML，但验证页面时会显示“target不是属性”。 - Kakalokia

谢谢。我也找到了使用jQuery的方法来做这件事，但是知道这种方法也很好:-)。 - Kakalokia

Answer 2

您是否必须使用JavaScript来完成这项任务？

如果不是的话，您可以直接在HTML中为a标签添加属性。

例如：<a href="http://www.google.co.uk" target="_blank">Google</a>

如果不需要JavaScript，这可能是更容易的方法。

- Lucas

---

问题在于我只需要使用XHTML，但是当验证页面时，它会显示“target不是属性”的错误。 - Kakalokia

Answer 3

如果您需要依赖JavaScript：

基本上，您只需要更改您的if条件（检查锚链接是否指向外部位置）。

因此，不要使用if(anchor.getAttribute("href"))，而是使用if(anchor.getAttribute("href") && anchor.hostname!==location.hostname)。

通过一些代码清理，您的函数应该如下所示：

function externalLinks() {
  for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
    var b = c[a];
    b.getAttribute("href") && b.hostname !== location.hostname && (b.target = "_blank")
  }
}
;
externalLinks();

- eyecatchUp

---

请问给我负评的人可以解释一下为什么要这样做吗？谢谢！ - eyecatchUp

Answer 4

你想要使用 document.getElementById("theidgoeshere");

为此，请在您的链接中设置 id 属性，如下所示：

<a href="www.google.com" id="theidgoeshere">Google</a>

然后在你的 JavaScript 中

  var anchor = document.getElementById("theidgoeshere");
  if(anchor.getAttribute("href"))
      anchor.target = "_blank";

另外请注意，您可能希望不使用JavaScript。只需在锚点中添加target="_blank"即可。

- Joel