[javascript]GETパラメータをページ内の内部リンク全てに付与する


特定のURLパラメータがある場合に、全ページに同じパラメータを渡す必要があり、、
やり方を調べたのでブログでもシェアします。

jQueryとPurlライブラリを読み込む

Purlは以下からダウンロードをします。
GitHub – allmarkedup/purl: [NO LONGER MAINTAINED] A JS utility for for parsing URLs and extracting information out of them.

<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='purl.js'></script>

JavaScriptコード

以下のコードにて全てのaタグにGETパラメータを付与します。
外部リンクにはパラメータは不要なため、内部リンク(http://~から始まるドメイン名および相対パス)にのみ付与する処理をしています。

jQuery( function( $ ) {
 //GETパラメータが無い場合は処理終了
if (location.search == '') {
return;
}
//GETで取得する値
var req_params = $.url(location.href).param();
var reg = new RegExp("^(https?:)?\/\/"+document.domain);
$('a').each(function(){
var url = $(this).attr('href');
if(typeof url !== "undefined") {
if (url.match(reg) || url.charAt(0) === "/") {
//内部リンク時の処理
var parsed = $(this).url();
var old_params = (parsed.attr('query') == '') ? {} : parsed.param();
var new_path = parsed.attr('path') + '?' + $.param($.extend(old_params, req_params));
$(this).attr('href', new_path);
}
}
});
});

すでにリンク先に指定のパラメータがある場合も想定されるため、
既存のパラメータにマージする処理をしています。

以下のサイトを参考にさせていただきました!
jQuery クエリパラメータを全リンクに付加

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

follow us in feedly