用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.