Javascript 检测Firefox中的点击链接

我想在我的firefox扩展中检测链接是否被点击。到目前为止，我在窗口中添加了一个click事件监听器

  window.addEventListener("click", function(event) { handleWindowClick(event); }, false);

  ...

  handleWindowClick : function(event)  {
    if ("event.target is a link") {
      // do something
    }
  };

---

对于某些链接，event.target是简单的URL。但是，对于我得到的一些链接，例如，作为event.target的HTMLPanelment。我在捕捉链接点击的正确轨道上，还是有其他方法？如果它以这种方式工作，我如何确保成功测试event.targetr是否为链接？

为什么不将单击事件侦听器置于锚定位置

---

为什么不把点击事件监听器放到锚上呢

---

您正在向主窗口添加一个事件侦听器，该窗口记录任何单击。您遇到问题的url必须包装在标记中。您需要的是

您正在向主窗口添加一个事件侦听器，该窗口将注册任何单击。您遇到问题的url必须包装在标记中。你需要的是看看这个，我希望这就是你要找的

window.addEventListener("click", function(event) {
    handleWindowClick(event);
}, false);

function handleWindowClick(event){
   var origEl = event.target || event.srcElement;
    if(origEl.tagName === 'A')
       alert("anchor link is clicked");
    else if(origEl.parentNode.tagName === 'A')
         alert("clicked inside anchor");
    else if(origEl.tagName === 'SPAN')
        alert("span  is clicked");
}

---

小提琴：

看看这个，我希望这就是你要找的

window.addEventListener("click", function(event) {
    handleWindowClick(event);
}, false);

function handleWindowClick(event){
   var origEl = event.target || event.srcElement;
    if(origEl.tagName === 'A')
       alert("anchor link is clicked");
    else if(origEl.parentNode.tagName === 'A')
         alert("clicked inside anchor");
    else if(origEl.tagName === 'SPAN')
        alert("span  is clicked");
}

---

fiddle:

我扩展了dku.rajkumar的答案，以支持A标签中的任意构造。我只是沿着树往上走，直到我找到一个A或者我在根，所以在这种情况下没有点击链接。这似乎奏效了。谢谢大家的帮助

 window.addEventListener("click", function(event) { handleWindowClick(event); }, false);
 ...

 isLink : function(element) {
   if(element.tagName === 'A')
     return true;
   else 
     if (element.parentNode) 
       return this.isLink(element.parentNode)
     else
       return false;
 },

 handleWindowClick : function(event) {
   var element = event.target || event.srcElement;
   var isLink = this.isLink(element);
   if (isLink) 
     dump("A link has been clicked.\n");
 },

---

我扩展了dku.rajkumar的答案，以支持A标签中的任意构造。我只是沿着树往上走，直到我找到一个A或者我在根，所以在这种情况下没有点击链接。这似乎奏效了。谢谢大家的帮助

 window.addEventListener("click", function(event) { handleWindowClick(event); }, false);
 ...

 isLink : function(element) {
   if(element.tagName === 'A')
     return true;
   else 
     if (element.parentNode) 
       return this.isLink(element.parentNode)
     else
       return false;
 },

 handleWindowClick : function(event) {
   var element = event.target || event.srcElement;
   var isLink = this.isLink(element);
   if (isLink) 
     dump("A link has been clicked.\n");
 },

---

谢谢你的回复。我已经看到了这个解决方案。这看起来有点像“杀伤力过大”，特别是因为我不需要在链接之间进行区分。我只是想测试它是否是一个链接。但也许我会接受这种方法。@Christian，许多程序员花大部分时间优化最不重要的事情-目前，我将使用此解决方案。这是唯一一个让我得到我想要的结果的方法@托马斯：你可能是对的！实际上，我不知道如果一个页面有大量的链接，从性能的角度来看这意味着什么。这对我来说似乎没有必要：。@Christian，事实上你是对的，我在包含500多个链接的页面上遇到了这些问题，一个带有折叠分支的jquery树，需要花费0.5秒的时间。我不记得运行脚本，所以我对这个页面进行了特殊优化。。。但在99%的情况下这不是问题。谢谢你的回复。我已经看到了这个解决方案。这看起来有点像“杀伤力过大”，特别是因为我不需要在链接之间进行区分。我只是想测试它是否是一个链接。但也许我会接受这种方法。@Christian，许多程序员花大部分时间优化最不重要的事情-目前，我将使用此解决方案。这是唯一一个让我得到我想要的结果的方法@托马斯：你可能是对的！实际上，我不知道如果一个页面有大量的链接，从性能的角度来看这意味着什么。这对我来说似乎没有必要：。@Christian，事实上你是对的，我在包含500多个链接的页面上遇到了这些问题，一个带有折叠分支的jquery树，需要花费0.5秒的时间。我不记得运行脚本，所以我对这个页面进行了特殊优化。。。但在99%的情况下这不是问题。谢谢你的链接！是的，我想可能是这样的。但看起来我或多或少得知道HTML结构，对吗？我从中获得HtmlPanelment作为event.target的链接如下所示：。但是，如果有一个带有span和div的任意构造，会发生什么呢。而且我不认为我可以递归下去，因为在某一点上我可能也会找到一个链接。谢谢你的链接！是的，我想可能是这样的。但看起来我或多或少得知道HTML结构，对吗？我从中获得HtmlPanelment作为event.target的链接如下所示：。但是，如果有一个带有span和div的任意构造，会发生什么呢。而且我不认为我可以递归下去，因为在某一点上我可能也会找到一个链接。谢谢你的帖子！当然，它的工作原理和它应该的一样。问题是它不能满足我对链接的需求，比如，和普通文本的需求。两次单击都会导致span被单击，但一次是链接，另一次不是。如果origEl.tagName==span，则循环th。parentNodes查看它是否是一个锚定标签，直到你到达身体或一些常见的标签，以确认该跨度不在锚定中。是的，绝对。。您可以检查父节点。。我已经更新了代码和示例。检查它是否能解决你的问题。谢谢你的帖子！当然，它的工作原理和它应该的一样。问题是它不能满足我对链接的需求，比如，和普通文本的需求。两次单击都会导致span被单击，但一次是链接，另一次不是。如果origEl.tagName==span，则循环th。parentNodes查看它是一个锚定标记，直到u到达主体还是某个公共标记到c

---

确认这个跨度不是固定的。是的，绝对。。您可以检查父节点。。我已经更新了代码和示例。检查它是否解决了你的目的。