event.preventDefault()与返回false

当我想阻止其他事件处理程序在某个事件被触发后执行时,我可以使用两种技术之一。 我将在示例中使用jQuery,但这也适用于纯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; 比执行一个方法更简单,更短,也可能更less出错。 用这个方法,你必须记住正确的套pipe,括号等

另外,我必须在callback中定义第一个参数才能调用该方法。 也许,有一些原因,我应该避免这样做,并使用preventDefault呢? 什么是更好的方法?

jQuery事件处理程序中 return false传递的jQuery.Event对象上同时调用e.preventDefaulte.stopPropagation相同。

e.preventDefault()将防止发生默认事件, e.stopPropagation()将防止事件冒泡,并return false将做到这一点。 请注意,这种行为不同于普通 (非jQuery)事件处理程序,其中,特别是, return false不会阻止事件冒泡。

资料来源: John Resig

使用event.preventDefault()比“return false”取消href点击有什么好处?

根据我的经验,当使用event.preventDefault()时,至less有一个明显的优势,就是使用return false。 假设你正在捕获一个锚点标签上的点击事件,否则如果用户被导航离开当前页面,这将是一个大问题。 如果您的点击处理程序使用return false来阻止浏览器导航,则会打开解释器无法到达返回语句的可能性,浏览器将继续执行锚点标记的默认行为。

 $('a').click(function (e) { // custom handling here // oops...runtime error...where oh where will the href take me? return false; }); 

使用event.preventDefault()的好处是你可以添加它作为处理程序的第一行,从而保证锚点的默认行为不会触发,不pipe函数的最后一行没有达到(例如运行时错误)。

 $('a').click(function (e) { e.preventDefault(); // custom handling here // oops...runtime error, but at least the user isn't navigated away. }); 

这不是像你所说的那样,是一个“JavaScript”问题; 这是关于jQuerydevise的一个问题。

jQuery和John Resig 之前的相关引用 (在karim79的 消息中 )似乎是对事件处理程序一般工作方式的误解。

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

MDN的文档解释了如何在事件处理函数中return false

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

有关详细信息,请参阅MSDN上的attachEvent和W3C DOM 2 Events文档 。

一般来说,您的第一个选项( preventDefault() )是您要采取的选项,但是您必须知道您处于什么样的环境以及您的目标是什么。

燃料您的编码有一个伟大的文章return false; vs event.preventDefault() vs event.stopPropagation() vs event.stopImmediatePropagation()

注意:上面Fuel Your Coding链接已经产生了5xx错误很长时间了。 我在Internet Archive中find它的一个副本,将它打印到PDF中,并将其放入Dropbox: 归档文章return false; vs event.preventDefault() vs event.stopPropagation() vs event.stopImmediatePropagation() (PDF)

当使用jQuery时, return false在你调用它时做了三件事情:

  1. event.preventDefault();
  2. event.stopPropagation();
  3. 停止callback执行,并在调用时立即返回。

查看jQuery事件:停止(错误)使用返回False获取更多信息和示例。

您可以在onClick事件中为一个元素挂起很多function。 你怎么能确定那个false是最后一个呢? 另一方面, preventDefault一定会阻止元素的默认行为。

我认为

event.preventDefault()

是W3C规定的取消事件的方式。

您可以阅读W3C规范中关于事件取消的内容 。

你也不能在任何情况下使用return false。 当在href属性中给出一个javascript函数时,如果你返回false,那么用户将被redirect到一个写入了假string的页面。

我认为最好的方法是使用preventDefault,因为如果在处理程序中引发了一些exception,那么返回false语句将被忽略,行为会与你想要的相反,所以最好使用event.preventDefault()方法

但如果确定代码不会触发任何exception,那么你可以按照你的意愿去任何方法。

如果你仍然想要返回false,那么你可以把你的整个处理程序代码放在下面的try catch块中

 $('a').click(function (e) { try{ your code here......... } catch(e){} return false; }); 

根据我的经验,我的看法是,使用总是比较好

 event.preventDefault() 

实际上要停止或阻止提交事件,只要我们要求而不是return false event.preventDefault()工作正常。