Javascript將一個onclick事件附加到帶有href變量的所有鏈接

Question

我試圖為我的所有帶有“外部鏈接”類的鏈接添加onclick函數。 因此，我已經成功完成了該測試，並在我單擊該按鈕的任何時候都進行了測試，以提醒它“起作用”，但是該鏈接的href如何返回到函數中呢？ 我想在該變量中輸入“ http://www.example.com ”。 我嘗試了elements [i] .href，但它是未定義的。

var elements = document.getElementsByClassName('external-link');
for(var i = 0, len = elements.length; i < len; i++) {
    elements[i].onclick = function () {
      trackOutboundLink(‘http://www.example.com’); return false;
    }
}

Answer 1

您的onclick回調的上下文將是被單擊的鏈接，因此您可以簡單地使用'this.href'

var elements = document.getElementsByClassName('external-link');
for(var i = 0, len = elements.length; i < len; i++) {
    elements[i].onclick = function () {
      trackOutboundLink(this.href); return false;
    }
}

Answer 2

您是否考慮過為此使用jQuery？ 它有助於保持簡單明了的代碼，與大多數瀏覽器兼容，並使您無需處理復雜的對象樹。

 <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script> $(document).ready(function(){ $("a.external-link").click(function(){ alert("You clicked an external link to: " + $(this).attr("href")); }); }); </script> </head> <body> <a class="external-link" href="http://www.example1.com">Example 1</a><br> <a class="external-link" href="http://www.example2.com">Example 2</a><br> <a class="internal-link" href="http://www.example3.com">Example 3</a> - <i>no alert</i> </body> </html>

資源：

jQuery教程1
jQuery教程2

Javascript將一個onclick事件附加到帶有href變量的所有鏈接

問題描述

2 個解決方案

解決方案1
2 已采納 2015-01-30 15:38:23

解決方案2
0 2015-01-30 16:39:40

Javascript將一個onclick事件附加到帶有href變量的所有鏈接

問題描述

2 個解決方案

解決方案1 2 已采納 2015-01-30 15:38:23

解決方案2 0 2015-01-30 16:39:40

解決方案1
2 已采納 2015-01-30 15:38:23

解決方案2
0 2015-01-30 16:39:40