All geek questions in one place

Html link, href assignment from Javascript function

I have a simple Javascript function that builds the url I want to provide a link to.

However, I cannot force the anchor tag to be bound to it. How to assign href anchor tags to Javascript function results?

None of them work correctly:

<a href="getUrl();">Click here</a> <a href="javascript:getUrl();">Click here</a>

This is what I want to accomplish.

+6
source share
6 answers
 <script type="text/javascript"> function getUrl() { return "http://www.google.com"; } </script> <a href="javascript:document.location.href=getUrl();">Click here</a>

- update -

If I wanted to include user278064s comments, I would change this to:

  <script type="text/javascript"> function getUrl() { return "http://www.google.com"; } </script> <a href="#" onClick="document.location.href=getUrl();">Click here</a>
+11
source

None of the above solutions worked for me. A good way would be to create a new link in the function.

 function fetchURL() { var title = "Download"; var URL = title.link("https://www.google.com"); document.getElementById("dynamicButton").innerHTML = URL; } 
 <body onload="fetchURL()"> <div id="dynamicButton"> //empty </div>
+1
source 
 <a onclick="getUrl();" href="#">Click here</a>

Press here

0
source

Give the id link:

 <a id="specialLink">Click Here</a>

Later, install it href from JavaScript:

 document.getElementById('specialLink').href = getUrl();

(You might want to include the href link in the link that people with JavaScript disabled will see.)

0
source 
 function getUrl(that) { return "www.whateveryouwant.com"; } // Point the a.href attribute at your url. var a = document.getElementsByTagName('a')[0]; a.href = getUrl();

UPDATE

I assume that you want to use the getUrl() method to set the href attribute, because perhaps the specified pointer is not static (therefore, it can change at any time by e-mail to the getUrl () URL.)

In any case, you can assign the href attribute when the user clicks on the link in this way.

 function changeHref(aElem) { aElem.href = getUrl(); }

Following the full code:

 <a href="#" onclick="changeHref(this);">click me!</a> <script> function getUrl(that) { return "www.whateveryouwant.com"; } function changeHref(aElem) { aElem.href = getUrl(); } </script>

One more thing. You should avoid using javascript: pseudo-protocol .

This snippet will explain to you why:

A pseudo-protocol is a non-standard approach to this idea. The javascript: pseudo-protocol is assumed to be used to invoke JavaScript from a link. Here's how to use javascript: a pseudo protocol to call the popUp function:

 <a href="javascript:popUp('http://www.example.com/');">Example</a>

This will work just fine in browsers that understand javascript: pseudo-protocol. However, older browsers will try to follow the link and fail. Even in browsers that understand the pseudo-protocol, the link becomes useless if JavaScript is disabled. In short, using the javascript pseudo protocol: usually a very poor way to reference JavaScript from your markup.

DOM Scripting: JavaScript Web Design and Document Object Model: Second Edition

0
source

The following worked for me

 <script type="text/javascript"> $(function() { document.getElementById("aTag").href = getUrl(); }); </script> <a id="aTag">Click Here</a>
0
source

Source: https://habr.com/ru/post/894312/

More articles:


All Articles