Javascript stopPropagation:element.addEventListener vs onclick属性

我正在玩

stopPropagation

，从一个

问题是：如果我像他们那样使用

element.addEVentListener（“单击”，fname）

，一切都会正常工作。
但是，当我尝试使用元素的

onclick

属性（

）附加函数时，传播不会停止。
如果我使用

，则根本不会调用fname（）（我还尝试传递

fname（ev）

，结果相同）

有人吗？如果需要查看代码，请告诉我。

执行此操作时：

<div onclick="fname();">

但即使这样也不可靠，因为它假定自动生成的匿名函数接受使用名称

event

的

event

参数，或者您使用的是IE或一个IE喜欢的浏览器，并且您正在查看IE的全局

window.event

属性

更可靠的做法是：

<div onclick="return fname();">

…并让

fname

返回

false

，以停止传播并阻止浏览器的默认操作

所有这些都是为什么我强烈主张如果您想在事件中做任何有趣的事情（或者，10次中有9次，即使您不想），总是使用DOM2方法（

addEventListener

，即

attachEvent

——在IE9之前的IE上，参数略有不同）来连接处理程序的原因

---

---

主题外：这是我建议使用、或之类的库来消除浏览器差异的原因之一，这样您就可以专注于自己的工作。

实际上，您的活动以以下方式进行：

事件激发、捕获阶段、冒泡阶段，事件已应用默认操作

因此，为了停止传播，可以执行以下操作：

element1.addEventListener('click',fname,true)  // Capturing phase
element1.addEventListener('click',fname,false) // Bubbling phase

fname(event){
  event.stopPropagation();
//event.preventDefault(); is also available here (in both phases I believe)
}

请注意，传播只能在冒泡阶段停止，并且只有以这种方式使用事件处理程序才能中断事件

据我所知，传统的治疗方法

<div onclick="return fname();">

---

不允许此功能。

我实际上反驳了这一点，并建议不要使用公共框架。尽管它们有各自的优势，但可以很容易地创建跨浏览器框架实现。我建议至少先编写您自己的定制框架，这样您就可以完全理解引擎盖下发生的所有事情。这有助于您在将来不会遇到像这样的问题！把事情抛在脑后，抛在脑后，（在一个框架中）是不好的做法！更容易并不意味着更快或更好！很高兴知道，谢谢！现在我会继续使用addEventListener。否则，我会使用jQuery来处理这类事情。这只是一个快速测试页面，所以我还没有链接到jQ。@Greg:“…可以很容易地创建跨浏览器框架实现…”哦，这么多年来，很多人都这么认为。：-）只要浏览一下任何主要库的源代码，如果你和我一样，你就会欣赏利用其他人所做的所有调试的能力。例如，在某些情况下，Safari会在

select

框中错误报告所选项目，或者在IE6上插入

script

元素时必须小心，以避免遇到奇怪的

base

元素错误。等等（续）@Greg：（继续）完全同意你必须知道引擎盖下发生了什么，但我仍然不会独自驾驶这架飞机，我在同事中很出名，因为我喜欢说“哦，不可能那么复杂，让我们自己做吧……”；-）

<div onclick="return fname();">