[JavaScript]URLのパラメータをハッシュとして取得する

URLのパラメータをハッシュとして取得する関数です。
URLのパラメータというのは、”http://example.com/?key1=value1&key2=value2″というURLがあった場合、”key1=value1&key2=value2″に相当する部分です。

上記例の場合に、関数をコールすると以下の2要素を持つハッシュがリターンされます。
params[ “key1” ] = “value1”;
params[ “key2” ] = “value2”;



関数です。

//--------------------------------------------
// URLのパラメータをハッシュとして取得する
//--------------------------------------------
<script>
function getQueryString () {
    var retVal = new Array();
 
    // 「?」以降のパラメータ部を取得する
    var searchStr = window.location.search;
    if ( searchStr == "" ) {
        alert( "no params" );
        return;
    }
 
    // 各パラメータに分割する
    var params = searchStr.substring( 1 ).split( "&" );
 
    // 分割した全パラメータをハッシュに登録する
    for ( var i = 0; i < params.length; i++ ) {
        // パラメータのkey,valueを取得する
        keyValue = params[i].split( "=" );
 
        // ハッシュに値を登録する
        if ( keyValue.length == 1 ) {
            retVal[ keyValue[0] ] = "";
        } else {
            retVal[ keyValue[0] ] = keyValue[1];
        }
    }
 
    // 登録されたハッシュを返す
    return retVal;
}
</script>




関数の呼び側の例は、以下のような感じになります。

<input id="btnInput" type="button" value="表示" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    // 入力ボタンがクリックされたときのハンドラ
    $("#btnInput").click(function() {
        params = getQueryString();
        for( var key in params ) {
            alert( "key[" + key + "] -> [" + params[key] + "]"  );
        }
    });
});
</script>


関連記事

コメントを残す

メールアドレスが公開されることはありません。