web-dev-qa-db-ja.com

新しいタブでリンクを開く

私が行っているプロジェクトのウェブサイトを作成しました。ウェブサイトのコンテンツには、アクセスできる外部ウェブページへのリンクがいくつかあります。その間、ユーザーがリンクの1つをクリックすると、指定されたリンクに移動し、現在のページには表示されなくなります。私がやりたかったのは、クリックされたリンクで指定されたWebサイトが、ユーザーがリンクをクリックしたときに新しいタブに表示されるようにすることです。このようにして、ユーザーは自分の現在のページにとどまり、新しいタブで他のページを表示することもできます。

私はインターネットを調べて、これが役に立つように思われることを発見しました：

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;

私が直面している問題は、私のWebサイトのナビゲーションバーにアンカータグが含まれていることです。したがって、ユーザーがナビゲーションバーのリンクをクリックすると、新しいタブが開きます。これは、ユーザーが私のWebサイトのコンテンツ内のリンクをクリックした場合にのみ発生するようにします。したがって、ユーザーがナビゲーションバーのリンクをクリックしても、新しいタブは開かず、指定された宛先に移動する必要があります。

コンテンツ内のすべてのリンクにクラスを追加してgetElementByClassNameを使用しようとしましたが、それでも機能しませんでした

誰でもこれで私を助けることができます

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

もう一つの例：

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

これは、ターゲット属性を利用します。

ターゲット属性の詳細： 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>
28
anonymous

これにはJavaScriptを使用する必要がありますか？

そうでない場合は、HTMLのタグに属性を直接追加することができます。

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

Javascriptが必要ない場合は、おそらくそれがより簡単な方法です。

2
Jake Lucas

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();
0
eyecatchUp