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中文網其他相關文章！