添加或更新查询字符串参数 - URL保持不变

Question

I am using this block of code to manage query string parameters :

function UpdateQueryString(key, value, url) {
    if (!url) url = window.location.href;
    var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi");

    if (re.test(url)) {
        if (typeof value !== 'undefined' && value !== null)
            return url.replace(re, '$1' + key + "=" + value + '$2$3');
        else {
            var hash = url.split('#');
            url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, '');
            if (typeof hash[1] !== 'undefined' && hash[1] !== null) 
                url += '#' + hash[1];
            return url;
        }
    }
    else {
        if (typeof value !== 'undefined' && value !== null) {
            var separator = url.indexOf('?') !== -1 ? '&' : '?',
                hash = url.split('#');
            url = hash[0] + separator + key + '=' + value;
            if (typeof hash[1] !== 'undefined' && hash[1] !== null) 
                url += '#' + hash[1];
            return url;
        }
        else
            return url;
    }
}

Function source : add or update query string parameter

I am calling the function, everything runs fine but the url on my browser is not changed. I used also Chrome console to check if the function was correctly called and the function is ok and retuns the expected value but the url remains unchanged.

Thanks for your help

Answer 1

This function is not changing the url. It's simply returning a string.

If you wanna change the url (reloading the page) you should write something like this:

window.location.href = UpdateQueryString(your_key, your_value, your_url)

If you wanna change the url without reloading the entire page, using the HTML5 History/State APIs, you might be interested in this:

https://github.com/browserstate/history.js/

Answer 2

the point is this function doesn't change the url, you should do it by yourself like:

 window.location.href = UpdateQueryString("yourkey","newvalue");

or change it like:

function UpdateQueryString(key, value, url) {
    //this flag is to check if you want to change the current page url
    var iscurrentpage = false;
    if (!url){
        url = window.location.href;
        iscurrentpage = true;
    }
    var re = new RegExp("([?&])" + key + "=.*?(&|#|$)(.*)", "gi");

    //this variable would be used as the result for this function
    var result = null;

    if (re.test(url)) {
        if (typeof value !== 'undefined' && value !== null) result = url.replace(re, '$1' + key + "=" + value + '$2$3');
        else {
            var hash = url.split('#');
            url = hash[0].replace(re, '$1$3').replace(/(&|\?)$/, '');
            if (typeof hash[1] !== 'undefined' && hash[1] !== null) url += '#' + hash[1];
            result = url;
        }
    } else {
        if (typeof value !== 'undefined' && value !== null) {
            var separator = url.indexOf('?') !== -1 ? '&' : '?',
                hash = url.split('#');
            url = hash[0] + separator + key + '=' + value;
            if (typeof hash[1] !== 'undefined' && hash[1] !== null) url += '#' + hash[1];
            result = url;
        } else result = url;
    }
    //if this is current page update the current page url
    if(iscurrentpage) window.location.href = result;
    return result;
}

then call it without the url parameter, just with 2 parameter:

UpdateQueryString("yourkey", "newvalue");