jQuery/Javascript-是否使用附加的查询字符串重新加载当前页面?
我的表单上有一个下拉菜单,当选择某个内容时,我需要重新加载当前页面,但附加了一个查询字符串 我该怎么做呢jQuery/Javascript-是否使用附加的查询字符串重新加载当前页面?,javascript,jquery,Javascript,Jquery,我的表单上有一个下拉菜单,当选择某个内容时,我需要重新加载当前页面,但附加了一个查询字符串 我该怎么做呢 var params = [ "foo=bar", "base=ball" ]; window.location.href = "http://" + window.location.host + window.location.pathname + '?' + params.join('&'); 您的change事件处理程序中的代
var params = [
"foo=bar",
"base=ball"
];
window.location.href =
"http://" +
window.location.host +
window.location.pathname +
'?' + params.join('&');
您的change
事件处理程序中的代码将起作用
例如:
$('#my_dropdown_id').bind('change', function(){
var params = [
"foo=bar",
"base=" + $(this).val()
];
window.location.href = "http://" + window.location.host + window.location.pathname + '?' + params.join('&');
});
这是一个老问题,但它首先出现在谷歌搜索结果中 我采用的解决方案与jAndy的类似
window.location.pathname
提供了不带查询字符串的页面url。
然后,我可以使用“?”+$.param({'foo':'bar','base':'ball')
构建查询字符串,然后将其附加到路径名并设置为window.location.href
window.location.href = window.location.pathname+"?"+$.param({'foo':'bar','base':'ball'})
如果你的答案是最高等级的,你可能想替换
http://
在代码中使用
window.location.protocol
因此,它适用于其他协议,如https或文件。所以
window.location.href = window.location.protocol + "//" + window.location.host + window.location.pathname + '?' + params.join('&');
如果您有一个想要保留的现有查询字符串,那么这个版本会这样做,并将您的新参数添加到任何现有参数中。这些键将转换为小写,以便不添加重复项。维护查询字符串确实会使解决方案更加复杂,因此我只会在需要时这样做
$("#sortby").change(function () {
var queryString = getQueryStrings();
// Add new params to the querystring dictionary
queryString["sortby"] = $("#sortby").val();
window.location.href =
window.location.protocol + "//" +
window.location.host +
window.location.pathname +
createQueryString(queryString);
});
// http://stackoverflow.com/questions/2907482
// Gets Querystring from window.location and converts all keys to lowercase
function getQueryStrings() {
var assoc = {};
var decode = function (s) { return decodeURIComponent(s.replace(/\+/g, " ")); };
var queryString = location.search.substring(1);
var keyValues = queryString.split('&');
for (var i in keyValues) {
var key = keyValues[i].split('=');
if (key.length > 1) {
assoc[decode(key[0]).toLowerCase()] = decode(key[1]);
}
}
return assoc;
}
function createQueryString(queryDict) {
var queryStringBits = [];
for (var key in queryDict) {
if (queryDict.hasOwnProperty(key)) {
queryStringBits.push(key + "=" + queryDict[key]);
}
}
return queryStringBits.length > 0
? "?" + queryStringBits.join("&")
: "";
}
如果您想要一种简单的方法来保留查询字符串并可能附加到它,请使用
window.location.search
;下面是一个片段:
var search = window.location.search + (window.location.search ? "&" : "?");
search += "param1=foo¶m2=bar";
window.location.href = window.location.protocol + "//" + window.location.host + window.location.pathname + search;
当然,您可以使用更复杂的方法构建查询字符串的其余部分,如其他示例中所示,但关键是要利用
位置。搜索我需要在重新加载后打开特定选项卡。所以我只需要将#tabs-4附加到当前url。我知道这与当前的帖子无关,但它可以帮助其他人,就像我一样
使用代码
window.location = window.location.pathname
+ window.location.search + '#tabs-4';
不适用于我,但下面的代码适用
location = "#tabs-4";
location.reload(true);
实际上,您可以使用一个内置的location
函数,该函数的名称是
对于附加或修改,您也可以使用URL
类的另一个内置函数。函数的名称为
因此,对于您的案例,您只需要以下示例:
constURL=新url(location.href);
url.searchParams.set('key','value');
location.assign(url.search);
到目前为止,您得到了什么?有代码吗?如果你很忙,不介意重复你自己,window.location.href+=“&foo=bar&base=ball”
可以在紧要关头完成。注意下面关于不直接指定http的答案()。糟糕的解决方案,我们不能假设网站正在使用httpHi jgreen,欢迎使用堆栈溢出。感谢您将您的解决方案作为另一个答案分享。为一个老问题提供一个详细的答案当然也会对未来的访问者有所帮助+1您可能希望将此移动到“顶级回答者”下的评论Missing reputation,以便在此处添加评论,我相信