Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12
  1. #1
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    478
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Can JavaScript change a link's href?

    Let's say I have a link that looks like this:

    <a name="MyLink" href="otherpage1.htm">Other Page</a>

    Is there any JavaScript code I could use (it would perhaps be triggered by the onchange event of a listbox) to change the link to be like this instead (i.e. href of otherpage2.htm)?:

    <a name="MyLink" href="otherpage2.htm">Other Page</a>
    J. Paul Schmidt
    www.Bullschmidt.com - Freelance Web and Database Developer
    www.Bullschmidt.com/DevTip.asp - Classic ASP Design Tips

  • #2
    Regular Coder ellisd5's Avatar
    Join Date
    Jun 2002
    Location
    Uk
    Posts
    160
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Dont know about being able to change the href of the "a" tag maybe its possible in IE6.

    However you could store the url in a variable then change that variable depending on certain events. so......
    Code:
        <script>
        ...
            var theURL = "www.google.com";
        ...
        </script>
    
        <a href="javascript:document.location=theURL" >Other Page</a>
    
        <!-- other stuff that will change variable -->
    The word javascript in the href should be 1 word, for some reason its getting formated and display as two words on this forum, stange!
    Last edited by ellisd5; 08-26-2003 at 11:26 AM.
    Dale Ellis
    __________________

  • #3
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    478
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Thanks for the good answer Dale.

    The reason I wanted it to be a modified anchor tag is so that the user would still have the option of right-clicking and saving the target as...

    So do you know of any JavaScript that can do the same thing as right-clicking on a link and saving target as?

    The reason for this is that the site is for a songwriter who wants to put .mp3 files on the Web and let users listen to the song or download the song. And there is a listbox because there are various song lengths involved and the user can choose one.
    J. Paul Schmidt
    www.Bullschmidt.com - Freelance Web and Database Developer
    www.Bullschmidt.com/DevTip.asp - Classic ASP Design Tips

  • #4
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    try something based on

    var link ="otherpage1.htm";
    document.write('<a href = \"+link+'\" ...............>')

    and whichever function to change the variable link on event.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    Regular Coder
    Join Date
    Jul 2003
    Location
    Massachusetts
    Posts
    472
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This should work...

    Code:
    <script type="text/javascript">
      function update()
      {
         document.getElementById("link").href = document.f.s.value;
         return;
      }
    </script>
    
    <form name="f">
      <select name="s" onchange="update();">
        <option value="1.mp3">1.mp3</option>
        <option value="2.mp3">2.mp3</option>
        <option value="3.mp3">3.mp3</option>
      </select>
    
      <a href="1.mp3" id="link">Right Click -> Save Target As...</a>
    </form>
    Hope that helps you out.
    Moderator @ WebDeveloper.com
    Mentor @ WebXpertz.net

  • #6
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    478
    Thanks
    0
    Thanked 2 Times in 2 Posts
    fredmv,

    Thanks a lot for your great answer about having a listbox alter the href of a link! I tried it and it works!
    J. Paul Schmidt
    www.Bullschmidt.com - Freelance Web and Database Developer
    www.Bullschmidt.com/DevTip.asp - Classic ASP Design Tips

  • #7
    Regular Coder
    Join Date
    Jul 2003
    Location
    Massachusetts
    Posts
    472
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hey, no problem. Happy that helped you out.
    Moderator @ WebDeveloper.com
    Mentor @ WebXpertz.net

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    cross-browser solution:

    Code:
    <script type="text/javascript">
      function update(objS)
      {
         document.links["link"].href = objS.options[objS.selectedIndex].value;
      }
    </script>
    ...
    <form name="f">
      <select name="s" onchange="update(this);">
        <option value="1.mp3">1.mp3</option>
        <option value="2.mp3">2.mp3</option>
        <option value="3.mp3">3.mp3</option>
      </select>
    
      <a href="1.mp3" name="link">Right Click -> Save Target As...</a>
    </form>
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #9
    Regular Coder
    Join Date
    Aug 2003
    Posts
    383
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Might try fiddling with this:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript" language="javascript">
    
    function processclick(oLink) {
         var oSelect = document.forms.songform.elements.songlist;
         oLink.href = oSelect.options[oSelect.selectedIndex].value;
         return true;
    }
    
    </script>
    </head>
    <body>
    <form name="songform">
    <select name="songlist">
      <option value="BMs.mp3">Bite Me (short version)</option>
      <option value="BMd.mp3">Bite Me (dance version)</option>
      <option value="BMl.mp3">Bite Me (2 hrs.)</option>
    </select>____<a href="BMs.mp3" onclick="return processclick(this)"><font face="comic sans ms">play me!</font></a>
    </form>
    </body>
    </html>
    Last edited by cheesebag; 08-27-2003 at 06:01 PM.
    &nbsp;........ another wild guess ........

  • #10
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    using document.execCommand('SaveAs') will save the current document not a particular link.
    So the code I posted is I think the better solution. You just have to inform the user that if he wants to save the file instead of running it, he should right-click the link and choose "Save Target As..."
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #11
    Regular Coder
    Join Date
    Aug 2003
    Posts
    383
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK, wasn't aware of that. Modified the above, still prefer it to Glenn's. Don't think you should inform the user of a specific Internet Explorer procedure - there are alternative methods of saving links (and lots of musicians use Macs).
    &nbsp;........ another wild guess ........

  • #12
    New to the CF scene
    Join Date
    May 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I would like to contribute how I used this discussion:

    My goal was to change the popup window address upon an action in a webpage that was being generated by PHP interpreter:


    I changed the code of the function like this:
    Code:
    //update links
    function update(objS)
    {
    document.links["varlink"].href = objS.href; //options[objS.selectedIndex]
    }
    And I change the lines of html document like this:
    Code:
    <a name="varlink" ... >
    
    <script language="javascript">
    document.write('<?php echo '<a name="varlink" href="javascript:popupWindow ...>
    
    <a href="javascript:popupWindow('<?php echo 'http://www.
    ; update(this); return false;"
    Sorry if it is confusing. I could not paste the rest of the code.

    Encouragements,
    Last edited by cordoval; 05-03-2008 at 07:43 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •