在JavaScript中使用URL的GET参数

如果我在一个页面上,如

http://somesite.com/somepage.php?param1=asdf

在该页面的JavaScript中,我想设置一个variables到URL的GET部分的参数值。

所以在JavaScript中:

<script> param1var = ... // ... would be replaced with the code to get asdf from URI </script> 

什么会“…”成为?

这是一些示例代码

 <script> var param1var = getQueryVariable("param1"); function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i=0;i<vars.length;i++) { var pair = vars[i].split("="); if (pair[0] == variable) { return pair[1]; } } alert('Query Variable ' + variable + ' not found'); } </script> 

你可以得到位置对象的“search”部分 – 然后parsing出来。

 var matches = /param1=([^&#=]*)/.exec(window.location.search); var param1 = matches[1]; 

我做了gnarf的解决scheme的这种变化,所以调用和结果是类似于PHP:

 function S_GET(id){ var a = new RegExp(id+"=([^&#=]*)"); return decodeURIComponent(a.exec(window.location.search)[1]); } 

但是由于在函数中被调用会减慢进程,所以更好地使用它作为全局:

window[' var_name '] = decodeURIComponent( / var_in_get =([^&#=]*)/.exec(window.location.search)[1] ); .exec =([^&#=]*)/.exec(window.location.search)[1] );

UPDATE

由于我还在学习JS,所以在更多的JS行为中创build了一个更好的答案:

 Url = { get get(){ var vars= {}; if(window.location.search.length!==0) window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){ key=decodeURIComponent(key); if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);} else {vars[key]= [].concat(vars[key], decodeURIComponent(value));} }); return vars; } }; 

这允许使用Url.get来调用。

例子 url ?param1=param1Value&param2=param2Value可以这样调用:

 Url.get.param1 //"param1Value" Url.get.param2 //"param2Value" 

这里是一个snipet:

 // URL GET params url = "?a=2&a=3&b=2&a=4"; Url = { get get(){ var vars= {}; if(url.length!==0) url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value){ key=decodeURIComponent(key); if(typeof vars[key]==="undefined") {vars[key]= decodeURIComponent(value);} else {vars[key]= [].concat(vars[key], decodeURIComponent(value));} }); return vars; } }; document.querySelector('log').innerHTML = JSON.stringify(Url.get); 
 <log></log> 

从我的编程存档:

 function querystring(key) { var re=new RegExp('(?:\\?|&)'+key+'=(.*?)(?=&|$)','gi'); var r=[], m; while ((m=re.exec(document.location.search)) != null) r[r.length]=m[1]; return r; } 

如果该值不存在,则返回一个空数组。
如果该值存在,则返回一个包含一个值的数组。
如果存在多个具有名称的值,则返回包含每个值的数组。

例子:

 var param1var = querystring("param1")[0]; document.write(querystring("name")); if (querystring('id')=='42') alert('We apoligize for the inconvenience.'); if (querystring('button').length>0) alert(querystring('info')); 

以下是咖啡脚本中的操作方法(只要有人感兴趣)。

 decodeURIComponent( v.split( "=" )[1] ) if decodeURIComponent( v.split( "=" )[0] ) == name for v in window.location.search.substring( 1 ).split( "&" ) 

实际上你不需要做任何特别的事情。 您可以将JavaScript和PHP混合在一起,将PHP中的variables直接转换为JavaScript。

 var param1val = <?php echo $_GET['param1'] ?>; 

使用jQuery的? 我以前使用过这个: http : //projects.allmarkedup.com/jquery_url_parser/它工作得很好。

这看起来不错:

 function gup( name ){ name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); var regexS = "[\\?&]"+name+"=([^&#]*)"; var regex = new RegExp( regexS ); var results = regex.exec( window.location.href ); if( results == null ) return ""; else return results[1]; } 

来自http://www.netlobo.com/url_query_string_javascript.html

以下是JSLint喜欢的一个版本:

 /*jslint browser: true */ var GET = {}; (function (input) { 'use strict'; if (input.length > 1) { var param = input.slice(1).replace(/\+/g, ' ').split('&'), plength = param.length, tmp, p; for (p = 0; p < plength; p += 1) { tmp = param[p].split('='); GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp[1]); } } }(window.location.search)); window.alert(JSON.stringify(GET)); 

或者,如果你需要支持一个键的值,例如。 ?key = value1&key = value2你可以使用这个:

 /*jslint browser: true */ var GET = {}; (function (input) { 'use strict'; if (input.length > 1) { var params = input.slice(1).replace(/\+/g, ' ').split('&'), plength = params.length, tmp, key, val, obj, p; for (p = 0; p < plength; p += 1) { tmp = params[p].split('='); key = decodeURIComponent(tmp[0]); val = decodeURIComponent(tmp[1]); if (GET.hasOwnProperty(key)) { obj = GET[key]; if (obj.constructor === Array) { obj.push(val); } else { GET[key] = [obj, val]; } } else { GET[key] = val; } } } }(window.location.search)); window.alert(JSON.stringify(GET)); 

你可以使用这个function

 function getParmFromUrl(url, parm) { var re = new RegExp(".*[?&]" + parm + "=([^&]+)(&|$)"); var match = url.match(re); return(match ? match[1] : ""); } 

如果你已经在运行一个PHP页面

php位:

  $json = json_encode($_REQUEST, JSON_FORCE_OBJECT); print "<script>var getVars = $json;</script>"; 

js位:

  var param1var = getVars.param1var; 

但对于Html页面,何塞·巴西里奥的解决scheme看起来不错。

祝你好运!