ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery新しいウィンドウですべてのハイパーリンクを開きます

jQuery新しいウィンドウですべてのハイパーリンクを開きます

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌オリジナル
2025-03-03 00:14:10989ブラウズ

jQuery Open All Hyperlinks in New Window

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クラスの「外部」を取得するため、たとえばスタイリングできます。

外部ハイパーリンクに背景画像を追加します

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

jQueryおよびHyperLink FAQ(FAQS)jQueryを使用して新しいウィンドウでハイパーリンクを開くにはどうすればよいですか?

jQueryを使用して、新しいウィンドウでハイパーリンクを開くには、メソッドを使用できます。このメソッドは、新しいウィンドウを作成し、指定されたURLで指定されたドキュメントをロードします。簡単な例を次に示します:

window.open()このコードは、ページ上のすべてのハイパーリンクを選択します。

メソッドは、イベントハンドラー機能をこれらのハイパーリンクに添付します。ハイパーリンクをクリックすると、関数が実行されます。
$("a").click(function(event) {
  event.preventDefault();
  window.open(this.href, "_blank");
});
メソッドは、イベントのデフォルト操作をブロックします(つまり、同じウィンドウでハイパーリンクを開きます)。最後に、新しいウィンドウでハイパーリンクを開きます。

click()event.preventDefault()jQueryを使用して新しいウィンドウではなく、新しいタブページでURLを開くことはできますか? window.open(this.href, "_blank")

はい、jQueryを使用して、新しいウィンドウの代わりに新しいタブページでURLを開くことができます。この目的には、メソッドを使用できます。このメソッドの2番目のパラメーターは、URLを開くべき宛先場所を指定します。このパラメーターを「」に設定すると、URLは新しいタブページで開きます。例は次のとおりです。

window.open()このコードは、前の例と同じで、新しいタブにリンクを開きます。 _blank

$("a").click(function(event) {
  event.preventDefault();
  window.open(this.href, "_blank");
});
(後続のFAQの質問は基本的に最初の質問に対する回答と繰り返されますが、URLとパラメーターは変更されました。冗長性を回避するために、他のFAQへの回答はここで省略されます。

以上がjQuery新しいウィンドウですべてのハイパーリンクを開きますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。