首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使用Javascript/jQuery在URL中添加或替换查询参数?

如何使用Javascript/jQuery在URL中添加或替换查询参数?
EN

Stack Overflow用户
提问于 2017-02-21 19:30:54
回答 10查看 22.8K关注 0票数 10

我使用的是jQuery 1.12。我希望替换窗口URL查询字符串中的查询字符串参数,或者如果不存在则添加该参数。我尝试了以下几点:

代码语言:javascript
运行
复制
new_url = window.location.href.replace( /[\?#].*|$/, "?order_by=" + data_val )  
window.location.href = new_url 

但我发现,这会删除查询字符串中所有以前的参数,我不想要这些参数。如果查询字符串是:

代码语言:javascript
运行
复制
?a=1&b=2

我希望新的查询字符串是:

代码语言:javascript
运行
复制
?a=2&b=2&order_by=data

如果查询字符串是:

代码语言:javascript
运行
复制
?a=2&b=3&order_by=old_data

它将成为:

代码语言:javascript
运行
复制
?a=2&b=3&order_by=data
EN

回答 10

Stack Overflow用户

回答已采纳

发布于 2017-02-25 19:54:31

你可以用一个jQuery插件来帮你做所有的工作。它将解析查询字符串,并为您重构更新的查询字符串。更不用说处理代码了。

插件下载页面

Github回购

代码语言:javascript
运行
复制
// URL: ?a=2&b=3&order_by=old_data

var order_by = $.query.get('order_by');
//=> old_data

// Conditionally modify parameter value
if (order_by) { 
  order_by = “data”;
}

// Inject modified parameter back into query string
var newUrl = $.query.set(“order_by”, order_by).toString();
//=> ?a=2&b=3&order_by=data

对于那些使用Node.js的人,有一个软件包可以在NPM中使用。

NPM包

Github回购

代码语言:javascript
运行
复制
var queryString = require('query-string');
var parsed = queryString.parse('?a=2&b=3&order_by=old_data');  // location.search

// Conditionally modify parameter value
if (parsed.order_by) {
  parsed.order_by = 'data';
}

// Inject modified parameter back into query string
const newQueryString = queryString.stringify(parsed);
//=> a=2&b=3&order_by=data
票数 5
EN

Stack Overflow用户

发布于 2017-02-21 19:59:04

像这样吗?

代码语言:javascript
运行
复制
let new_url = "";

if (window.location.search && window.location.search.indexOf('order_by=') != -1) {
  new_url = window.location.search.replace( /order_by=\w*\d*/, "order_by=" + data_val);
} else if (window.location.search) {
  new_url = window.location.search + "&order_by=" + data_val;
} else {
  new_url = window.location.search + "?order_by=" + data_val;
}
window.location.href = new_url;
票数 3
EN

Stack Overflow用户

发布于 2017-02-23 21:26:39

代码语言:javascript
运行
复制
function addOrReplaceOrderBy(newData) {
  var stringToAdd = "order_by=" + newData;

  if (window.location.search == "")
    return window.location.href + stringToAdd;

  if (window.location.search.indexOf('order_by=') == -1)
    return window.location.href + stringToAdd;

  var newSearchString = "";
  var searchParams = window.location.search.substring(1).split("&");
  for (var i = 0; i < searchParams.length; i++) {
    if (searchParams[i].indexOf('order_by=') > -1) {
      searchParams[i] = "order_by=" + newData;
      break;
    }
  }
  return window.location.href.split("?")[0] + "?" + searchParams.join("&");
}

window.location.href = addOrReplaceOrderBy("new_order_by");

有点长,但我认为它是按预期工作的。

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42376287

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档