协慌网

当我想在某个事件被触发后阻止其他事件处理程序执行时，我可以使用两种技术之一。我将在示例中使用 jQuery，但这也适用于 plain-JS：

1. event.preventDefault()

$('a').click(function (e) {
    // custom handling here
    e.preventDefault();
});

2. return false

$('a').click(function () {
    // custom handling here
    return false;
});

这两种停止事件传播的方法之间有什么显着差异吗？

对我来说， return false;比执行方法更简单，更短并且可能更不容易出错。使用该方法，您必须记住正确的套管，括号等。

另外，我必须在回调中定义第一个参数才能调用该方法。也许，为什么我应该避免这样做并使用preventDefault ？有什么更好的方法？

从jQuery 事件处理程序中 return false e.preventDefault与在传递的jQuery.Event 对象上调用e.preventDefault和e.stopPropagation相同。

e.preventDefault()将阻止发生默认事件， e.stopPropagation()将阻止事件冒泡并return false将同时执行。请注意，此行为与正常 （非 jQuery 的）事件处理程序不同，其中，值得注意的是， return false 不冒泡停止该事件。

资料来源： John Resig

使用 event.preventDefault（）而不是 “return false” 来取消 href 点击有什么好处？

根据我的经验，使用 event.preventDefault（）而不是使用 return false 时，至少有一个明显的优势。假设您正在捕获锚标记上的 click 事件，否则如果用户被导航离开当前页面将是一个大问题。如果您的单击处理程序使用 return false 来阻止浏览器导航，则会打开解释器无法访问 return 语句并且浏览器将继续执行锚标记的默认行为的可能性。

$('a').click(function (e) {
  // custom handling here

  // oops...runtime error...where oh where will the href take me?

  return false;
});

使用 event.preventDefault（）的好处是你可以将它添加为处理程序中的第一行，从而保证锚点的默认行为不会触发，无论是否未到达函数的最后一行（例如，运行时错误） ）。

$('a').click(function (e) {
  e.preventDefault();

  // custom handling here

  // oops...runtime error, but at least the user isn't navigated away.
});

正如你所说的那样，这不是一个 “JavaScript” 问题; 这是一个关于 jQuery 设计的问题。

jQuery 和John Resig 先前链接的引用 （在karim79 的 消息中 ）似乎是对事件处理程序如何工作的源头误解。

事实：返回 false 的事件处理程序会阻止该事件的默认操作。它不会阻止事件传播。自 Netscape Navigator 的旧时代以来，事件处理程序一直以这种方式工作。

MDN的文档解释了事件处理程序中return false的工作原理

jQuery 中发生的事情与事件处理程序的情况不同。 DOM 事件监听器和 MSIE“附加” 事件完全不同。

有关进一步阅读，请参阅MSDN 上的 attachEvent和W3C DOM 2 Events 文档 。