add parameter to links on page using jquery

Here is a solution I put together for native Javascript, it supports existing query strings and anchors:

function addToQueryString(url, key, value) {
    var query = url.indexOf('?');
    var anchor = url.indexOf('#');
    if (query == url.length - 1) {
        // Strip any ? on the end of the URL
        url = url.substring(0, query);
        query = -1;
    }
    return (anchor > 0 ? url.substring(0, anchor) : url)
         + (query > 0 ? "&" + key + "=" + value : "?" + key + "=" + value)
         + (anchor > 0 ? url.substring(anchor) : "");
}

I've posted my existing tests on JSBin: http://jsbin.com/otapem/2/


Like this:

$(function() {
    $('a[href]').attr('href', function(index, href) {
        var param = "key=value";

        if (href.charAt(href.length - 1) === '?') //Very unlikely
            return href + param;
        else if (href.indexOf('?') > 0)
            return href + '&' + param;
        else
            return href + '?' + param;
    });
})

If you're interested in plugins, there's the jQuery Query String Object. This will allow you simple checking of parameters in the querystring, and if necessary the ability to add more, remove some, or edit others.


You could do something like this:

$(function() {
   $("a").attr('href', function(i, h) {
     return h + (h.indexOf('?') != -1 ? "&ajax=1" : "?ajax=1");
   });
});

On document.ready this looks at every <a>, looks at it's href, if it contains ? already it appends &ajax=1 if it doesn't, it appends ?ajax=1.