add parameter to links on page using jquery

Question

How do I add let's say something like ajax=1 to all links on my page with jquery. I will also need to check if the url has existing parameters. for example http://example.com/index.php?pl=132 will have to become http://example.com/index.php?pl=132&ajax=1

Also, if the link does not have any parameters, for example http://example.com/index.php, it will become http://example.com/index.php?ajax=1 I want to load the jQuery script on document ready so all links are changed on page load.

Answer 1

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.

Answer 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;
    });
})

Answer 3

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/

Answer 4

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.

Answer 5

Taking what is above, this is the best way to concatenate parameters to links.

Also avoid link with href like href="Javascript:YourFunction();"

$(function(){                                      
   var myRandom = getRandom();       
   $('a[href]').each(function(i){
        var currHref = $(this).attr("href");
        var isAfunction = currHref.substring(0,10);              
        if(isAfunction == "javascript"){                
            $(this).attr("href",currHref);
        }else{
            if (currHref.charAt(currHref.length - 1) === '?')                           
                $(this).attr("href",currHref);
            else if (currHref.indexOf('?') > 0)                
                $(this).attr("href",currHref+"&rand="+getRandom());
            else                  
                $(this).attr("href",currHref+"?rand="+getRandom());
        }
   });               
});
function getRandom(){
    var randomnumber = Math.floor(Math.random()*10000); 
    return randomnumber;
}

Answer 6

a href must be full and corrected URL.

$(function() {
  $('a[href]').attr('href', function(index, href) {
    var url = new URL(href);
    url.searchParams.set('ajax',1);
    return url;
  });
})

JSFiddle