Question

I need to dynamically change the href of an achor link on the screen to what the user is typing into an input box. I have jquery loaded if necessary or can use raw javascript.

Extra note that may or may not be important: The div that contains the input box and the anchor link is itself dynamic (may or may not be on the screen depending on the user’s actions) so I am going to use the ‘live’ function of jquery to run the code when the div box appears. This is necessary since I am using various posts to navigate through the website (it is for mobile web platforms).

Thanks for any help

Edit: Hey thanks for answers my question they are great and put me in the right direction but I have realised I didn’t think through my question (sorry), what I want to actually do is append what they type onto the END of an existing href (it’s a Get request to an api) So if they type ‘example’ it will add ‘example’ onto the href of ‘www.apitest.com?variable=’. It would be really helpful if you could tweak your example to do this. Thank you.

Answer 1

I don’t know the structure of you page, so you need to replace $(‘input’), $(‘a’) with selectors of input and anchor according to your page.

var apiUrl = 'www.apitest.com?variable=';
$('input').live('keyup', function(){
    $('a').attr('href', apiUrl+$(this).val());
});