How to append variable to url in jquery?

Question

How can I append variable/text to the attribute href in jquery ?

score 12 · Accepted Answer · answered Mar 27 '11 at 20:28

12

You could use the .attr() function:

var foo = 'foo=bar';
$('a#foo').attr('href', function(index, attr) {
    return attr + '?' + foo;
});

or:

$('a#foo').attr('href', function() {
    return this.href + '?' + foo;
});

answered Mar 27 '11 at 20:28

Darin Dimitrov

994,864
265
3,241
2,902

1

This doesn't take into consideration what the existing url is – JohnC Jun 26 '14 at 13:09
3

This will break urls which already have a querystring. Have a look at @JohnC's answer. – Tom Bowers Jun 26 '14 at 13:11

score 10 · Answer 2 · answered Jun 02 '14 at 14:53

You need to check if there is already a query string before appending items to the url based on the other examples you'd do something like.

var foo = 'foo=bar';
$('a').attr('href', function(index, attr) {
    return attr + (attr.indexOf('?') >=0 ? '&' : '?') + foo;
});

score 2 · Answer 3 · answered Mar 27 '11 at 20:27

2

$('a').attr('href', function(i, v) {
    return v + 'text...';
});

answered Mar 27 '11 at 20:27

Šime Vidas

173,790
60
275
374

@Steffi The index of the element inside the jQuery object - irrelevant in this case. – Šime Vidas Mar 27 '11 at 20:30

zoombaro · Answer 4 · 2012-12-06T20:59:00.620

1

If you use it repeatedly try .attr() as:

HTML: <a id='foo' href='#'>I am your father,.. nooooo</a>

var myparams = 'myvar=myvalue';
var myurl = 'TypeThe_NetscapeURL';
$('a#foo').attr('href', function() {
    return myurl + '?' + myparams;
});

edited Dec 06 '12 at 20:59

answered Dec 06 '12 at 20:43

zoombaro

27
4

Couple of comments: 1.that would work but it's actually overriding the value NOT appending. To append, get the value first $("#foo").attr('href') and then append whatever you need to it. 2. in example above you don't need a function which returns url. simple myurl+'?'+myparams should do it. This is a case of taking a url and appending to it. Setting it to an href is just a byproduct. Check out http://stackoverflow.com/questions/179713/how-to-change-the-href-for-a-hyperlink-using-jquery for setting hrefs – Alexey Gerasimov Dec 06 '12 at 21:12

How to append variable to url in jquery?

4 Answers4