it-swarm.com.ru

обновить параметры в URL с помощью history.pushState ()

Я использую history.pushState, чтобы добавить несколько параметров к URL текущей страницы после выполнения вызова AJAX на моей странице. Теперь на той же странице, основанной на действиях пользователя, я хочу снова обновить URL страницы с тем же или дополнительным набором параметров. Итак, мой код выглядит так:

var pageUrl = window.location.href + "?" + queryString;
window.history.pushState('','',pageUrl);

queryString - мой список параметров запроса.

Но с помощью приведенного выше кода мои параметры добавляются к URL с параметрами, и они выглядят так, как показано ниже после второго вызова AJAX:

http://sample.com?param1=foo&param2=bar&param1=foo,foo1&param2=bar&param3=another_foo

Таким образом, параметры появляются в URL-адресе дважды, есть ли способ заменить параметры в URL-адресе перед тем, как перейти в «Историю», или любой другой лучший способ добиться этого в javascript (jquery)?

16
Kush

Я думаю, что вам нужно, это удалить window.location.href и оставить '?' +.

var pageUrl = '?' + queryString;
window.history.pushState('', '', pageUrl);
14
yofferHorist

Эта функция может быть полезна

function updateUrlParameter(param, value) {
    const regExp = new RegExp(param + "(.+?)(&|$)", "g");
    const newUrl = window.location.href.replace(regExp, param + "=" + value + "$2");
    window.history.pushState("", "", newUrl);
}

Правка : Следующее решение проще, и оно также работает, если параметр еще не является частью URL. Тем не менее, он не поддерживается Internet Explorer (вы не говорите?).

function setQueryStringParameter(name, value) {
    const params = new URLSearchParams(location.search);
    params.set(name, value);
    window.history.replaceState({}, "", decodeURIComponent(`${location.pathname}?${params}`));
}
7
tocqueville