2011-01-11 23 views
203

可能性の重複:
How can I get query string values?jqueryのGETクエリ文字列URLから

私は、次のURL持っている:私は必要なもの

http://www.mysite.co.uk/?location=mylocation1 

をからlocationの値を取得することですURLを変数に入力してjQueryコードで使用します:

var thequerystring = "getthequerystringhere" 

$('html,body').animate({scrollTop: $("div#" + thequerystring).offset().top}, 500); 

誰でもJavaScriptまたはjQueryを使用してその値を取得する方法を知っていますか?

+0

を必要とするすべてはsome1を助けるかもしれです。 https://gist.github.com/helpse/4d4842c69782b9f94a72 – helpse

答えて

388

から:これは、何が必要ですhttp://jquery-howto.blogspot.com/2009/09/get-url-parameters-values-with-jquery.html

:)

次のコードは、URLパラメータ含むJavaScriptオブジェクトが返されます:あなたはURLを持っている場合、例えば

// Read a page's GET URL variables and return them as an associative array. 
function getUrlVars() 
{ 
    var vars = [], hash; 
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
    for(var i = 0; i < hashes.length; i++) 
    { 
     hash = hashes[i].split('='); 
     vars.push(hash[0]); 
     vars[hash[0]] = hash[1]; 
    } 
    return vars; 
} 

を:

http://www.example.com/?me=myValue&name2=SomeOtherValue 

このコードは:

{ 
    "me" : "myValue", 
    "name2" : "SomeOtherValue" 
} 

とあなたが行うことができます:

var me = getUrlVars()["me"]; 
var name2 = getUrlVars()["name2"]; 
+8

解決策はパラメータ値のエンコードを解除しないことに注意してください。また、URLの#値も明示的に処理していないようです。私は代わりに、@スティーブのようにhttp://stackoverflow.com/questions/901115/get-query-string-values-in-javascript/901144#901144を提案するだろう – Rory

+3

悪い答え。フラグメントを処理しません。 –

+5

@Rory、yes:これは: "http://stackoverflow.com?foo=bar#topic1"はあなたに{"foo": "bar#topic"}を与えます。これは、貧しい人がよく知られている図書館のソリューションを求めている理由です。おそらく、何らかのテストをしてすべての拠点をカバーしていたソリューションを見つけることを望んでいます(私は彼が探していたものだと言っています。必ずそれを提供するだろう)。 – kghastie

11

このstackoverflow answerを見てください。

function getParameterByName(name, url) { 
    if (!url) url = window.location.href; 
    name = name.replace(/[\[\]]/g, "\\$&"); 
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), 
     results = regex.exec(url); 
    if (!results) return null; 
    if (!results[2]) return ''; 
    return decodeURIComponent(results[2].replace(/\+/g, " ")); 
} 

あなたは、アニメーション化する方法を使用することができます。

すなわち:

var thequerystring = getParameterByName("location"); 
$('html,body').animate({scrollTop: $("div#" + thequerystring).offset().top}, 500); 
23

だけで、あなたのコンソールを表示し、いくつかのjQueryとストレートJSでこれを行う簡単な方法ChromeまたはFirefoxを使用して出力を確認してください。

var queries = {}; 
    $.each(document.location.search.substr(1).split('&'),function(c,q){ 
    var i = q.split('='); 
    queries[i[0].toString()] = i[1].toString(); 
    }); 
    console.log(queries); 
+2

途中で+とdecodeURIComponentを削除したい場合があります。代わりにwindow.location.searchを使用します – mplungjan

+0

Handy!空文字列のnullクエリ文字列要素を処理する場合は、 'if(i [0] .length> 0)...]ブロックを追加することをお勧めします。 – ericpeters0n

+3

また、 javascriptの行それは何年のことか?? – ericpeters0n

2

我々この方法を行う...

String.prototype.getValueByKey = function (k) { 
    var p = new RegExp('\\b' + k + '\\b', 'gi'); 
    return this.search(p) != -1 ? decodeURIComponent(this.substr(this.search(p) + k.length + 1).substr(0, this.substr(this.search(p) + k.length + 1).search(/(&|;|$)/))) : ""; 
}; 
+5

文字列オブジェクトにクエリ文字列値が関連付けられているとは思いません。 – Phil

133
+8

これは移植可能ですか? – Cheezmeister

+3

これは、URL文字列から検索文字列を返しません。現在のページの現在のアドレスバーの検索文字列値のみを返します。 – Dwight

+0

@Cheezmeister: 'location.search'はChrome、Firefox、IE10 +で動作します。 IE9で動作するかもしれませんが、私は手元に持っていません。 Dwight:window.location.searchはクエリ文字列を返します。コンソールの[このページ](http://stackoverflow.com/questions/4656843/jquery-get-querystring-from-url?a=b&c=d#e=f)で試してみてください。 a = b&c = d'である。 –

関連する問題