用jQuery获取查询string参数

任何人都知道写一个jQuery扩展来处理查询string参数的好方法? 我基本上想扩展jQuery魔术($)函数,所以我可以做这样的事情:

 $('?search').val(); 

哪个会给我的价值“testing”在以下url: http://www.example.com/index.php?search=test : http://www.example.com/index.php?search=test test。

我已经看到了许多可以在jQuery和Javascript中做到这一点的函数,但是我实际上想要扩展jQuery来像上面那样工作。 我不是在寻找一个jQuery插件,我正在寻找jQuery方法的扩展。

jQuery jQuery-URL-Parser插件做同样的工作,例如检索查询stringparam的值,你可以使用

 $.url().param('search'); 

这个库不积极维护。 正如同一个插件的作者所build议的那样,您可以使用URI.js。

或者你可以使用js-url来代替。 它非常类似于下面的一个。

所以你可以访问查询参数像$.url('?search')

为什么要扩展jQuery? 扩展jQuery与仅具有全局函数的好处是什么?

 function qs(key) { key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars var match = location.search.match(new RegExp("[?&]"+key+"=([^&]+)(&|$)")); return match && decodeURIComponent(match[1].replace(/\+/g, " ")); } 

http://jsfiddle.net/gilly3/sgxcL/

另一种方法是parsing整个查询string并将这些值存储在一个对象中供以后使用。 这种方法不需要正则expression式,并扩展了window.location对象(但是,可以很容易地使用全局variables):

 location.queryString = {}; location.search.substr(1).split("&").forEach(function (pair) { if (pair === "") return; var parts = pair.split("="); location.queryString[parts[0]] = parts[1] && decodeURIComponent(parts[1].replace(/\+/g, " ")); }); 

http://jsfiddle.net/gilly3/YnCeu/

这个版本还使用了Array.forEach() ,它在IE7和IE8中本地不可用。 它可以通过使用MDN实现来添加,也可以使用jQuery的$.each()来代替。

这不是我的代码示例,但是我已经使用它了。

 //First Add this to extend jQuery $.extend({ getUrlVars: function(){ 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; }, getUrlVar: function(name){ return $.getUrlVars()[name]; } }); //Second call with this: // Get object of URL parameters var allVars = $.getUrlVars(); // Getting URL var by its name var byName = $.getUrlVar('name'); 

从SitePoint的朋友那里find这个gem。 https://www.sitepoint.com/url-parameters-jquery/

使用PURE jQuery。 我只是用这个,它的工作。 举例来说,调整了一下。

 //URL is http://www.example.com/mypage?ref=registration&email=bobo@example.com $.urlParam = function (name) { var results = new RegExp('[\?&]' + name + '=([^&#]*)') .exec(window.location.href); return results[1] || 0; } console.log($.urlParam('ref')); //registration console.log($.urlParam('email')); //bobo@example.com 

尽你所能使用。

我写了一个小函数,你只需要parsing查询参数的名字。 所以,如果你有:?Project = 12&Mode = 200&date = 2013-05-27你想要的'模式'参数,你只需要parsing'模式'的名字进入function:

 function getParameterByName( name ){ var regexS = "[\\?&]"+name+"=([^&#]*)", regex = new RegExp( regexS ), results = regex.exec( window.location.search ); if( results == null ){ return ""; } else{ return decodeURIComponent(results[1].replace(/\+/g, " ")); } } // example caller: var result = getParameterByName('Mode'); 

build立在@Rob Neild上面的答案,这里是一个纯粹的JS适应,返回一个简单的解码查询string参数对象(没有%20的等)。

 function parseQueryString () { var parsedParameters = {}, uriParameters = location.search.substr(1).split('&'); for (var i = 0; i < uriParameters.length; i++) { var parameter = uriParameters[i].split('='); parsedParameters[parameter[0]] = decodeURIComponent(parameter[1]); } return parsedParameters; } 

写在香草的Javascript

  //Get URL var loc = window.location.href; console.log(loc); var index = loc.indexOf("?"); console.log(loc.substr(index+1)); var splitted = loc.substr(index+1).split('&'); console.log(splitted); var paramObj = []; for(var i=0;i<splitted.length;i++){ var params = splitted[i].split('='); var key = params[0]; var value = params[1]; var obj = { [key] : value }; paramObj.push(obj); } console.log(paramObj); //Loop through paramObj to get all the params in query string.