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