Jquery open url as a variable and change text

Question

I have this:

<fieldset id="social_associations" class="">
    <a href="/social/login/twitter">Associate your account to twitter</a>
    <br>
    <a href="/social/login/facebook">Associate your account to facebook</a>
    <br>
</fieldset>

And I would like a function to follow the URLs within these links but these URLs are generated by a script and may change according to the user's profile (if a user has already associated an account then the URL that will appear will have 'disconnect' instead of 'login') so the function must take whatever appears in the link, it can't be hardcoded. I don't want to leave the current page while clicking on it. And when a link is clicked I would like to change the text from associate... to disconnect. Must be easy but I have no clue!

EDIT:

I understand that the question is not clear so I rephrased it here: javascript on click change href and open in new window

Well, what I understood is: you want to load the content of a page and change the text of a button to "login" or "disconnect". Is that right? — Danilo Valente, May 07 '12 at 22:35
ok sorry :) No, I did not try XMLHttpRequest. I want a function that calls a get on the URLs that appear above. No exactly these URLs because they will change, I mean the html is generated by a script that checks if the user has already connected her account and then will generate another link (/social/disconnect/backend). And indeed when the link is clicked I want to switch to that URL and switch the text too. All of this without leaving the page. Is it more understandable or worse? — Bastian, May 07 '12 at 22:43

score 0 · Answer 1 · answered May 07 '12 at 22:41

To change the link text I'd do this. As for the rest of the question, I am not sure I understand.

$( '#social_associations' )
     .on( 'click', 'a[href*="/login/"]', function(){
             // not sure what 'follow the URLs within these links' means, but do it here

               //then change the link text
             $( this ).text( $( this ).text().replace( /Associate/i, "disconnect" ) );            
         })
     .on( 'click', 'a[href*="/disconnect/"]', function(){
               // not sure what 'follow the URLs within these links' means, but do it here

               //then change the link text
               $( this ).text( $( this ).text().replace( /disconnect/i, "Associate" ) );
         })

score 0 · Accepted Answer · answered May 07 '12 at 22:59

<script>
$(function(){
    $('#social_associations').each(function(){
        if(/this.href/.test(/login/i)){
            this.innerHTML = 'Login';
        }
        if(/this.href/.test(/disconnect/i)){
            this.innerHTML = 'Disconnect';
        }
    });
});
</script>
<fieldset id="social_associations" class="">
    <a href="/social/login/twitter">Associate your account to twitter</a>
    <br>
    <a href="/social/login/facebook">Associate your account to facebook</a>
    <br>
</fieldset>

I'm not sure if this is what you want, so tell me if it's not :)

I'm not sure to understand the code, and when I implement it, it has no effect on the page. I copied it right above the fieldset as shown in your example. — Bastian, May 08 '12 at 07:25

Jquery open url as a variable and change text

2 Answers2