在使用 AJAX 调用的 Web 应用程序中,我需要提交请求但在 URL 末尾添加一个参数,例如:
原网址:
结果网址:
http://server/myapp.php?id=10 &enabled=true
寻找一个 JavaScript 函数来解析 URL,查看每个参数,然后添加新参数或更新值(如果已经存在)。
在使用 AJAX 调用的 Web 应用程序中,我需要提交请求但在 URL 末尾添加一个参数,例如:
原网址:
结果网址:
http://server/myapp.php?id=10 &enabled=true
寻找一个 JavaScript 函数来解析 URL,查看每个参数,然后添加新参数或更新值(如果已经存在)。
您可以使用以下之一:
例子:
var url = new URL("http://foo.bar/?x=1&y=2");
// If your expected result is "http://foo.bar/?x=1&y=2&x=42"
url.searchParams.append('x', 42);
// If your expected result is "http://foo.bar/?x=42&y=2"
url.searchParams.set('x', 42);
您需要调整的基本实现如下所示:
function insertParam(key, value) {
key = encodeURIComponent(key);
value = encodeURIComponent(value);
// kvp looks like ['key1=value1', 'key2=value2', ...]
var kvp = document.location.search.substr(1).split('&');
let i=0;
for(; i<kvp.length; i++){
if (kvp[i].startsWith(key + '=')) {
let pair = kvp[i].split('=');
pair[1] = value;
kvp[i] = pair.join('=');
break;
}
}
if(i >= kvp.length){
kvp[kvp.length] = [key,value].join('=');
}
// can return this or...
let params = kvp.join('&');
// reload page with new params
document.location.search = params;
}
这大约是基于正则表达式或基于搜索的解决方案的两倍,但这完全取决于查询字符串的长度和任何匹配项的索引
我为了完成而进行基准测试的慢正则表达式方法(大约慢 150%)
function insertParam2(key,value)
{
key = encodeURIComponent(key); value = encodeURIComponent(value);
var s = document.location.search;
var kvp = key+"="+value;
var r = new RegExp("(&|\\?)"+key+"=[^\&]*");
s = s.replace(r,"$1"+kvp);
if(!RegExp.$1) {s += (s.length>0 ? '&' : '?') + kvp;};
//again, do what you will here
document.location.search = s;
}
const urlParams = new URLSearchParams(window.location.search);
urlParams.set('order', 'date');
window.location.search = urlParams;
.set 第一个参数是键,第二个参数是值。
感谢大家的贡献。我使用了annakata代码并修改为还包括 url 中根本没有查询字符串的情况。希望这会有所帮助。
function insertParam(key, value) {
key = escape(key); value = escape(value);
var kvp = document.location.search.substr(1).split('&');
if (kvp == '') {
document.location.search = '?' + key + '=' + value;
}
else {
var i = kvp.length; var x; while (i--) {
x = kvp[i].split('=');
if (x[0] == key) {
x[1] = value;
kvp[i] = x.join('=');
break;
}
}
if (i < 0) { kvp[kvp.length] = [key, value].join('='); }
//this will reload the page, it's likely better to store this until finished
document.location.search = kvp.join('&');
}
}
这是非常简单的解决方案。它不控制参数的存在,也不改变现有值。它将您的参数添加到 end,因此您可以在后端代码中获得最新值。
function addParameterToURL(param){
_url = location.href;
_url += (_url.split('?')[1] ? '&':'?') + param;
return _url;
}