使用jQuery/Javascript(querystring)获取查询字符串参数url值
有人知道编写jQuery扩展来处理查询字符串参数的好方法吗?我基本上想扩展jQuery magic使用jQuery/Javascript(querystring)获取查询字符串参数url值,javascript,jquery,url,jquery-plugins,query-string,Javascript,Jquery,Url,Jquery Plugins,Query String,有人知道编写jQuery扩展来处理查询字符串参数的好方法吗?我基本上想扩展jQuery magic($)函数,这样我就可以执行以下操作: $('?search').val(); 这将给我以下URL中的“test”值:http://www.example.com/index.php?search=test 我已经在jQuery和Javascript中看到了很多可以实现这一点的函数,但实际上我想扩展jQuery,使其完全按照上面所示的方式工作。我不是在寻找jQuery插件,而是在寻找jQuery
($)
函数,这样我就可以执行以下操作:
$('?search').val();
这将给我以下URL中的“test”值:http://www.example.com/index.php?search=test
我已经在jQuery和Javascript中看到了很多可以实现这一点的函数,但实际上我想扩展jQuery,使其完全按照上面所示的方式工作。我不是在寻找jQuery插件,而是在寻找jQuery方法的扩展 这不是我的代码示例,但我以前使用过它。
//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');
//首先添加它以扩展jQuery
$扩展({
getUrlVars:function(){
var vars=[],散列;
var hashes=window.location.href.slice(window.location.href.indexOf('?')+1).split('&');
for(var i=0;i
JQuery插件执行相同的工作,例如,要检索search查询字符串参数的值,可以使用
$.url().param('search');
此库未被积极维护。正如同一插件的作者所建议的,您可以使用
或者你可以用它来代替。它与下面的很相似
因此,您可以访问查询参数,如
$.url(“?搜索”)
为什么要扩展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, " "));
}
另一种方法是解析整个查询字符串,并将值存储在对象中供以后使用。这种方法不需要正则表达式,并扩展了window.location
对象(但也可以很容易地使用全局变量):
此版本还使用了
Array.forEach()
,这在IE7和IE8中本机不可用。可以使用添加,也可以使用jQuery。我编写了一个小函数,只需解析查询参数的名称即可。因此,如果您有:?Project=12&Mode=200&date=2013-05-27,并且需要'Mode'参数,则只需将'Mode'名称解析到函数中:
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');
在SitePoint从我们的朋友那里找到了这颗宝石。 . 使用纯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.search);
return (results !== null) ? results[1] || 0 : false;
}
console.log($.urlParam('ref')); //registration
console.log($.urlParam('email')); //bobo@example.com
您可以随意使用。基于上面@Rob Neild的答案,这里是一个纯JS改编,它返回一个简单的解码查询字符串参数对象(无%20等)
函数parseQueryString(){
var parsedParameters={},
uriParameters=location.search.substr(1.split('&');
对于(var i=0;i
用普通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.
//获取URL
var loc=window.location.href;
控制台日志(loc);
var指数=位置指数(“?”);
控制台日志(loc.substr(索引+1));
分离的风险值=位置子项(指数+1)。分离('&');
console.log(拆分);
var paramObj=[];
对于(var i=0;i经过多年丑陋的字符串解析后,有一个更好的方法:URLSearchParams让我们看看如何使用这个新API从位置获取值
//Assuming URL has "?post=1234&action=edit"
var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?
post=1234&action=edit&active=1"
更新:不支持IE
从而不是从URLSearchParams使用此函数
$.urlParam = function (name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)')
.exec(window.location.search);
return (results !== null) ? results[1] || 0 : false;
}
console.log($.urlParam('action')); //edit
函数parseQueryString(queryString){
if(!queryString){
返回false;
}
let querys=queryString.split(&),params={},temp;
for(设i=0,l=querys.length;i
我用这个。提问和回答:@NicoWesterdale-我浏览了那个链接,但没有看到任何解决这个特定问题的答案。他说他想要的和上面一样。我认为你做不到,传入的字符串被sizzler解析,然后解析为DOM对象数组。你可以扩展matcher以提供自定义过滤器,但您不能拥有基于字符串的jquery对象。$
是否过载不够?@mrtsherman查看getParameterByName()函数在我提供的链接中。不,您不能直接在$prompt中执行此操作,但这不是jQuery选择器的用途。他只是选择URL字符串的一部分,而不是尝试访问DOM的一部分,这部分是$()是的。这完全是另一回事。如果你真的想使用jQuery,你可以编写一个使用以下语法的插件:$.getParameterByName(param),在我链接到的那一页的下面有一个例子,它正是这样做的。虽然有点毫无意义。这并不常见,但在查询参数中使用分号而不是符号是有效的。@Muhd-它是“有效的”只要代码理解,就可以在查询字符串中使用您喜欢的任何分隔符。但是,提交表单时,表单字段以name=value
对提交,由&
分隔。如果您的代码使用自定义查询字符串格式,显然,无论查询字符串位于何处,您都需要编写自定义查询字符串解析器无论是在服务器上还是在客户机上,都已使用。@nick-很有意思。但他们建议HTTP服务器将分号视为符号,这只会在使用链接模拟表单提交时使HTML更漂亮。这只是一个建议,是非标准的。标准表单GET
submission i
//Assuming URL has "?post=1234&action=edit"
var urlParams = new URLSearchParams(window.location.search);
console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?
post=1234&action=edit&active=1"
$.urlParam = function (name) {
var results = new RegExp('[\?&]' + name + '=([^&#]*)')
.exec(window.location.search);
return (results !== null) ? results[1] || 0 : false;
}
console.log($.urlParam('action')); //edit
function parseQueryString(queryString) {
if (!queryString) {
return false;
}
let queries = queryString.split("&"), params = {}, temp;
for (let i = 0, l = queries.length; i < l; i++) {
temp = queries[i].split('=');
if (temp[1] !== '') {
params[temp[0]] = temp[1];
}
}
return params;
}