Changing a target link with javascript

Question

I am trying to build a simple "form" where you input a "from" address and a "to" address and hit "OK".

I want the script to take the "from" and "to" and a preset text "maps.google.com/dir/ from / to" and change the a href value to that link.

Here is what I got from similar tutorials:

    <script type="text/javascript">
function getlinks(){
    var from = document.getElementById('from').value;
    var to = document.getElementById('to').value;
    var lnkgm = document.getElementById('lnkgm');
    lnkgm.href = "https://www.google.de/maps/dir/" + from + "/" + to;
}
</script>
From: <input type='text' id='from' value='' /><br>
To: <input type='text' id='to' value='' /><br>
<input type='button' onclick='getlinks()' value='OK'/><p>
<a href="lnkgm"><img src="image.png"></a>

this kinda worked in a text version using a "innerHTML" but I want the script to update the

Any pointers?

Thank you so much!

You have no element with the id lnkgm So I am sure your developer console tells you that. — epascarello
– epascarello, Commented Oct 31, 2016 at 12:33

DontVoteMeDown · Accepted Answer · 2016-10-31 12:33:54Z

1

Just change the href attribute to id:

<a href="lnkgm">

To

<a id="lnkgm" href="#">

As you're trying to get the element by id (document.getElementById('lnkgm')) you have to set it's id attribute.

Demo:

function getlinks(){
    var from = document.getElementById('from').value;
    var to = document.getElementById('to').value;
    var lnkgm = document.getElementById('lnkgm');
    lnkgm.href = "https://www.google.de/maps/dir/" + from + "/" + to;
  console.log(lnkgm.href);
}

From: <input type='text' id='from' value='' /><br>
To: <input type='text' id='to' value='' /><br>
<input type='button' onclick='getlinks()' value='OK'/><p>
<a id="lnkgm" href="#"><img src="image.png"></a>

answered Oct 31, 2016 at 12:33

DontVoteMeDown

21.5k10 gold badges72 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Paul Herrmann Over a year ago

Thank you! This is exactly the help I was looking for! :) It works perfectly.

user6269864 · Accepted Answer · 2016-10-31 12:34:15Z

0

You forgot to add the ID to your link:

<a id="lnkgm" href="lnkgm"><img src="image.png"></a>

answered Oct 31, 2016 at 12:34

user6269864

Collectives™ on Stack Overflow

Changing a target link with javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related