在带有标签的 url 上添加 GET 参数答案

【问题标题】：Adding GET parameter on url with a tag在带有标签的 url 上添加 GET 参数
【发布时间】：2013-12-22 02:35:09
【问题描述】：

我有一个像这样的网址

mysite.com/index.php?page=home&gender=female&age=22

或

mysite.com/index.php?page=home&gender=female&occupation=programmer

如何使用 a 标签添加新的参数 orderby=value 和 order=asc，就像提交按钮的工作方式一样。

当我点击链接名称时，它会在链接上添加新参数，我可以通过它对数据进行排序

<a href="#">Name</a> | <a href="#">Age</a>

就像 wordpress 处理它的方式一样

wordpress/wp-admin/users.php?orderby=login&order=desc

【问题讨论】：

【解决方案1】：

你可以使用：

document.URL + "orderby=desc"

唯一的问题是，当您再次单击时，您会得到两次 orderby。因此，您应该检查 url 是否已经包含 orderby 参数。

可以在这里找到更复杂的设置或替换 url 参数的函数：

【讨论】：

【解决方案2】：

使用它

var url = document.URL;
if(url.indexOf('orderby') == -1){
url = document.URL + "orderby=desc";
}

【讨论】：

【解决方案3】：

为什么不在模板渲染期间构建 URL？不需要JS

例如

<a href="/index.php?occupation=programmer&orderby=name&order=desc">Name</a>

只需在渲染和反转时检查当前订单值。

显然，如果您使用的是 AJAX，这不太有用。

【讨论】：

【解决方案4】：

您可以使用此处发布的功能https://stackoverflow.com/a/6021027/1021726。所有功劳归于业余爱好者。

该函数在查询字符串上创建新值或更新现有值。

在<a>标签上添加onclick事件，调用函数like

updateQueryStringParameter(window.url, "orderby", "myName");
updateQueryStringParameter(window.url, "order", "desc");

【讨论】：