Question

我正在尝试在div上单击时向当前URL添加一个参数，以使我不会丢失其他参数，也可以获得一些新参数

 <div class='tabes_09o12rt' onclick="window.location.search += '&sort=FOO';">
 <div class='tabes_09o12rt' onclick="window.location.search += '&sort=BAR';">

这工作正常，但是当我单击第一个div时，它会将paramenter FOO添加到url；当我单击div 2时，它会添加具有相同neme的paramenter BAR，我想要的是，如果已经添加了paramenter使用该名称，然后将其更改为新名称，如果未添加，则添加，然后双击删除该参数。我们可以做到吗???

Answer 1

解析URL，然后使用URLSearchParams API进行操作，而不是盲目附加。

const url = new URL(location);
console.log("Original", url.toString());
url.searchParams.set("sort", "foo")
console.log("Foo", url.toString());
url.searchParams.set("sort", "bar")
console.log("Bar", url.toString());
// location = url;

Answer 2

我们当然可以做到。只需存储原始字符串并将其检索到函数中即可。

<script type="text/javascript">
    var origin = window.location.search;
    function sort(method) {
       window.location.search = origin + '&sort=' + method;
    }
</script>

<div onClick="sort(foo)">Sort using foo</div>
<div onClick="sort(bar)">Sort using bar</div>

更改点击AJAX的URL

2 个答案: