Javascript 事件传播和多个事件处理程序

Javascript 事件传播和多个事件处理程序,javascript,javascript-events,event-handling,event-propagation,Javascript,Javascript Events,Event Handling,Event Propagation,好吧,我很困惑。我在文档上有一个全局单击事件处理程序。在页面上我有几个链接。每个链接都由相同的单击事件处理程序处理,该处理程序可以防止事件冒泡到文档级别,并防止链接执行。在这些链接中,有一个特定的click处理程序,该处理程序应该完成它的任务,然后将事件传递给链接的通用click事件。但事实并非如此 document.onclick = function() { document.body.innerHTML += "You clicked me!"; }; document.

好吧,我很困惑。我在
文档
上有一个全局单击事件处理程序。在页面上我有几个链接。每个链接都由相同的单击事件处理程序处理,该处理程序可以防止事件冒泡到文档级别,并防止链接执行。在这些链接中,有一个特定的click处理程序,该处理程序应该完成它的任务,然后将事件传递给链接的通用click事件。但事实并非如此

document.onclick = function()
  {
   document.body.innerHTML += "You clicked me!"; 
};

  document.getElementsByTagName("a")[0].onclick = function(e) {
   this.innerHTML += " Click it!";
    e.stopPropagation();
    //This return false appears only to
    //prevent the link from its default action
  return false; 
  };
document.getElementById("link").onclick = function(e) {
  this.innerHTML += " Go ahead, ";
  //But this return false appears to stop
  //the propagation up to the previous event
  //I would think that removing the link below
  //would cause the event to propagate to the event
  //above which would then stop the propagation and
  //prevent the default, but apparently this is 
  //not the case; removing the line below causes
  //the link to load Google like normal
  return false;
};
如何让较低的事件触发,然后向上触发较高的事件,然后取消事件


明白我的意思了吗。使用
element.on
只是在DOM中为元素设置属性,这意味着每个事件只能有一个处理程序。相反,我需要使用
addEventListener
并正确使用
event.preventDefault()
event.stopPropagation()

在我的第一次尝试中,我把我想成为的第一个处理程序放在第二位,但这确实意味着它将覆盖第一个处理程序。在这种情况下,我需要将我想要的处理程序放在第一位,因为处理程序被附加到事件

我的修订守则应为:

document.onclick = function()
  {
   document.body.innerHTML += "You clicked me!"; 
};
document.getElementById("link").addEventListener("click",function() {
  this.innerHTML += " Go ahead, ";
});
  document.getElementsByTagName("a")[0].addEventListener("click",function(e) {
   this.innerHTML += " Click it!"; 
    e.stopPropagation();
    e.preventDefault();
   });

不幸的是,我现在没有时间写一个详细的答案,但这个链接可能有助于解释:谢谢@James,这个链接很有用。幸运的是,我自己设法解决了我的问题。谢谢!:)仅供参考:DOM级别0事件(前缀为“on”)仅接受一个处理程序。你超越了它。此外,您可能会发现
document.links
有助于遍历。@Matt刚刚发现了这一点;哈哈,谢谢!