サイト内のリンクで別ドメインのものは全て別タブで開かせる

5893 Views
JavaScript
サイト内のリンクで別ドメインのものは全て別タブで開かせる

ブログを書いていると別サイトにリンクしたい時ってないですか?
別サイトだから、自分のサイトからアクセス後に離脱して欲しくないので、別タブで開かせてページを閉じたら戻ってきてほしいものですよね?

ただ、毎回「target=”_blank”」の設定をするのはめんどくさい!
僕もそう思い、簡単なjsを作ってみました。
一応、jQuery必須です。

SNSでシェア♪

スポンサーリンク

対応したいページに以下のjsを追加

//別ドメインの物は別タブで開く
$('a').on('click', function() {
	var _this   = $(this);
	var _href   = _this.attr('href');
	var _target = _this.attr('target')
	if (
		(_href.indexOf('http://') != -1 || _href.indexOf('https://') != -1) &&	//httpまたはhttpsがhrefに記述されていて
		!(typeof _target !== 'undefined' && _target !== false) &&				//targetの属性がなく
		!(_href.indexOf(location.host) != -1)										//ドメインが違う場合
	) {
		window.open(_href);
		return false;
	}
});

以上です。

内容としては
・hrefの指定に「http」または「https」の記述がある
・targetの属性がない
・ドメインが閲覧中のページと違う
ことで判定を行なっています。

そのため、すでに運用中のブログやサイトにも導入が可能です!

 

これで少し時間の短縮ができる様になったかと。

SNSでシェア♪

スポンサーリンク

関連記事