jQuery在新窗口中打开所有超链接

使用jQuery自定义超链接样式及在新窗口打开超链接

以下是一些使用jQuery自定义超链接CSS样式，使其脱颖而出的JavaScript代码片段，以及使用jQuery在新窗口中打开超链接的技巧。

在新窗口中打开超链接

// 使用jQuery在新窗口中打开所有超链接
$('a[href^="http://"]').attr("target", "_blank");
$(this).attr('href', newHref).attr("target", "_blank");

您可以通过简单的链式操作，向超链接添加图像或文本。此示例在链接文本末尾添加[^]。

自定义样式外部超链接

// 使用jQuery在新窗口中打开所有超链接
// 并为每个外部链接（包含“http://”）附加一个“^”
$('a[href^="http://"]').attr({
    target: "_blank",
    title: "在新窗口中打开"
}).append(' [^]');

接下来，添加一些jQuery代码：

$(document).ready(function() {
    $("a[@rel='external']").addClass("external")
       .click(function() { window.open($(this).href); return false; });
});

此代码查找所有具有rel="external"属性的锚点标签，并在单击时在新窗口中打开它们。“return false;”可防止当前页面也切换到URL。此外，这些链接将获得CSS类“external”，因此可以对其进行样式设置，例如：

为外部超链接添加背景图像

// 更改外部超链接的背景图像
a.external {
  padding-left: 15px;
  background: url(external-link.png) top left no-repeat;
}

jQuery和超链接常见问题解答 (FAQs)

如何使用jQuery在新窗口中打开超链接？

要使用jQuery在新窗口中打开超链接，可以使用window.open()方法。此方法创建一个新窗口并加载给定URL指定的文档。以下是一个简单的示例：

$("a").click(function(event) {
  event.preventDefault();
  window.open(this.href, "_blank");
});

此代码选择页面上的所有超链接。click()方法将事件处理程序函数附加到这些超链接。单击超链接时，将执行该函数。event.preventDefault()方法阻止事件的默认操作（即在同一窗口中打开超链接）。最后，window.open(this.href, "_blank")在新窗口中打开超链接。

我可以使用jQuery在新标签页而不是新窗口中打开URL吗？

是的，您可以使用jQuery在新标签页而不是新窗口中打开URL。window.open()方法可用于此目的。此方法的第二个参数指定应打开URL的目标位置。如果将此参数设置为“_blank”，则URL将在新标签页中打开。以下是一个示例：

$("a").click(function(event) {
  event.preventDefault();
  window.open(this.href, "_blank");
});

此代码与上一个示例相同，在新标签页中打开链接。

(后续的FAQ问题与第一个问题的回答基本重复，只是URL和参数有所变化，为了避免冗余，这里省略了其余FAQ的回答。) 所有FAQ的核心都是使用window.open(url, "_blank", "options")方法， 通过改变url和options参数来实现不同的效果。

以上是jQuery在新窗口中打开所有超链接的详细内容。更多信息请关注PHP中文网其他相关文章！