event.preventDefault() 与返回 false(无 jQuery) [英] event.preventDefault() vs. return false (no jQuery)

问题描述

我想知道 event.preventDefault() 和 return false 是否相同.

I wondered if event.preventDefault() and return false were the same.

我已经做了一些测试，看来

• 如果使用旧模型添加事件处理程序，例如

• If the event handler is added using old model, for example

elem.onclick = function(){
    return false;
};

然后，return false 阻止默认操作，例如 event.preventDefault().

Then, return false prevents default action, like event.preventDefault().

如果使用addEventListener添加事件处理程序，例如

If the event handler is added using addEventListener, for example

elem.addEventListener(
    'click',
    function(e){
        return false;
    },
    false
);

那么，return false 不会阻止默认操作.

Then, return false doesn't prevent the default action.

所有浏览器都这样吗?

event.preventDefault() 和 return false 是否有更多区别?

Are there more differences between event.preventDefault() and return false?

我在哪里可以找到一些关于 return false 在某些情况下表现得像 event.preventDefault() 的文档(我在 MDN 中找不到)?

Where I can find some documentation (I couldn't in MDN) about return false behaving like event.preventDefault() in some cases?

我的问题只是关于纯 javascript，而不是 jQuery，所以请不要将其标记为 event.preventDefault() vs. return false，即使两个问题的标题几乎相同.

My question is only about plain javascript, not jQuery, so please don't mark it as a duplicate of event.preventDefault() vs. return false, even if both questions have almost the same title.

推荐答案

W3C 文档对象模型事件规范.事件注册接口声明EventListener中的handleEvent没有返回值:

The W3C Document Object Model Events Specification in 1.3.1. Event registration interfaces states that handleEvent in the EventListener has no return value:

handleEvent每当发生类型的事件时调用此方法为其注册了 EventListener 接口.[...] 一去不复返价值

handleEvent This method is called whenever an event occurs of the type for which the EventListener interface was registered. [...] No Return Value

在 1.2.4 下.事件取消文档还指出

取消是通过调用事件的 preventDefault 来完成的方法.如果一个或多个 EventListeners 在任何时候调用 preventDefault事件流阶段将取消默认操作.

Cancelation is accomplished by calling the Event's preventDefault method. If one or more EventListeners call preventDefault during any phase of event flow the default action will be canceled.

这应该阻止您使用返回 true/false 可能在任何浏览器中产生的任何效果并使用 event.preventDefault().

which should discourage you from using any effect that returning true / false could have in any browser and use event.preventDefault().

更新

HTML5 规范实际上指定了如何处理不同的返回值.第 7.1.5.1 节HTML 规范指出

The HTML5 spec actually specifies how to treat a return value different. Section 7.1.5.1 of the HTML Spec states that

如果返回值为 WebIDL boolean false 值，则取消活动.

If return value is a WebIDL boolean false value, then cancel the event.

除了鼠标悬停"事件之外的所有内容.

for everything but the "mouseover" event.

结论

我仍然建议在大多数项目中使用 event.preventDefault()，因为您将与旧规范兼容，因此与旧浏览器兼容.仅当你只需要支持尖端浏览器时，返回false取消是可以的.

I would still recommend to use event.preventDefault() in most projects since you will be compatible with the old spec and thus older browsers. Only if you only need to support cutting edge browsers, returning false to cancel is okay.

这篇关于event.preventDefault() 与返回 false(无 jQuery)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！