jQueryを使って、外部サイトへのリンクだけ別ウィンドウで開く方法
以前、静岡の住宅建設会社さんのサイトをYahoo!カテゴリへの登録申請をした際に、外部サイトへのリンクが別ウインドウで
開いていない、という指摘を受けました。
対処方法は、外部サイトへのリンクは別ウインドウで開くようにAタグを書き直せば良いのですが、この静岡の住宅建設会社さんはページが多めなこともあり、今回はjQueryを使って、外部リンクの場合だけ別ウィンドウで開くように設定をしました。
(僕じゃなくてシステムの人がやってくれた。)
以下その方法
1.jQueryのサイトからjquery.jsをダウンロードしてくる。
2.ページのヘッダにjquery.jsを読み込む。
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
3.ページソース内(ヘッダとか)に下記スクリプトを書く。
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready( function () {
//Aタグのhrefの中身がhttpから始まるもので、www.sample.com以外の文字列が入っているものを判別。
$('a[@href^="http"]').not('[@href*="www.sample.com"]').click(function(){
//クリックした場合に、別ウィンドウでそのリンク先を開く。
window.open(this.href, '');
return false;});
});
</script>
</head>
これで、外部サイトへのリンクが、別ウィンドウで開くようになります。
僕は、3で書くスクリプトを外部ファイル化して、全ページに読み込ませました。
いちいちAタグを追って直してくより全然楽ちんですね。javascriptって便利だなぁ。