Question

我有一个简单的Javascript函数，可以构建一个我想提供链接的URL。

但是，我似乎无法使锚标签处理它。如何为锚标记的href分配Javascript函数的结果？

其中任何一个都无法正常工作：

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

这就是我想要完成的事情。

Answer 1

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

- 更新 -

如果我想合并user278064s的评论，我会将上述内容改为：

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

Answer 2

以上解决方案均不适合我。一个好方法是在函数中创建一个新链接。

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>

Answer 3

<a onclick="getUrl();" href="#">Click here</a>

Click Here

Answer 4

为链接指定id：

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

稍后，从JavaScript设置href：

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

（您可能希望在禁用JavaScript的人看到的链接中添加占位符href。）

Answer 5

function getUrl(that) {
   return "www.whateveryouwant.com";
}

// Point the a.href attribute at your url.
var a = document.getElementsByTagName('a')[0];
a.href = getUrl();

<强>更新

我假设你想使用getUrl()方法设置href属性，因为可能指向的url不是静态的（所以它可能随时改变，指向getUrl（）返回的url。）

无论如何，你可以用这种方式分配href属性，即用户点击链接时。

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

完整代码：

<a href="#" onclick="changeHref(this);">click me!</a>

<script>
   function getUrl(that) {
      return "www.whateveryouwant.com";
   }

   function changeHref(aElem) {
      aElem.href = getUrl();
   }
</script>

另一件事。您应该避免使用javascript: pseudo-protocol。

这个片段将解释你原因：

伪协议对这个想法是非标准的。 javascript：伪协议应该用于从链接中调用JavaScript。以下是javascript：伪协议将用于调用popUp函数的方法：

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

这对于理解javascript：pseudo-protocol的浏览器来说效果很好。但是，较旧的浏览器会尝试关注链接并失败。即使在了解伪协议的浏览器中，如果已禁用JavaScript，则链接将变得无用。简而言之，使用javascript：pseudo-protocol通常是一种非常糟糕的引用JavaScript的方式从你的标记中。

DOM脚本：使用JavaScript进行网页设计和文档对象模型：第二版

Answer 6

以下为我工作

<script type="text/javascript">
   $(function() {
        document.getElementById("aTag").href = getUrl();
   });
</script>

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

html链接，来自Javascript函数的href赋值

6 个答案: