跨浏览器方式确定是否取消了DOM事件

Is there a cross-browser way from a javascript event handler to determine whether the event has been cancelled by a previous handler? IE and other browsers like Chrome etc. have an event.returnValue property that can be tested, but FireFox doesn't appear to have any such property.

是否有来自javascript事件处理程序的跨浏览器方式来确定事件是否已被先前的处理程序取消? IE和其他浏览器(如Chrome等)具有可以测试的event.returnValue属性,但FireFox似乎没有任何此类属性。

Here's an example of the scenario I'm talking about. You have a form like so:

这是我正在谈论的场景的一个例子。你有一个这样的表格:

<form id="test" name="test" onsubmit="return false;" />

And you hook up an event to it in javascript, with addEventListener/attachEvent (hookup ommitted for brevity). The event needs to know if anything prior in the chain returned false or otherwise canceled it. The IE version is like so:

并且你在javascript中使用addEventListener / attachEvent(为了简洁而省略了hookup)将事件连接到它。事件需要知道链中的任何先前是否返回false或以其他方式取消它。 IE版本是这样的:

function onSubmitHandler(e) {
    alert("event was cancelled prior to this handler: " + e.returnValue);
}

This works in IE, Chrome, etc., but of course not in FireFox as it doesn't have event.returnValue. I've combed the intarwebs for any other way to determine this in FireFox and come up with nothing. Is there a solution for this problem that doesn't involve setting the onsubmit attribute of the form directly?

这适用于IE,Chrome等,但当然不适用于FireFox,因为它没有event.returnValue。我已经用intarwebs梳理了任何其他方法来确定FireFox中的这个并且没有任何结果。是否有解决此问题的方法不涉及直接设置表单的onsubmit属性?

2 个解决方案

#1

My understanding is that the primary use of event.returnValue is to prevent the default action for that event (i.e. canceling it). For example, in a handler like yours above:

我的理解是event.returnValue的主要用途是阻止该事件的默认操作(即取消它)。例如,在像你这样的处理程序中:

function onSubmitHandler(e) {
    e.returnValue = false;
}

The above code in IE would prevent the default action, preventing the form from being submitted. The equivalent code in Firefox, according to the Gecko DOM Reference, is:

IE中的上述代码将阻止默认操作,从而阻止提交表单。根据Gecko DOM Reference,Firefox中的等效代码是:

e.preventDefault();

If you want to check if an event has been canceled, and do so in a cross-browser way, would using a library like jQuery be an option? Using jQuery to bind a function to the onsubmit event of the form and have that handler call .preventDefault() would accomplish the same thing across all supported browsers. Further, you could then use the .isDefaultPrevented() method of the jQuery event object to determine if the event has been canceled, presumably accomplishing what you are trying for with lhs = e.returnValue.

如果你想检查一个事件是否被取消,并以跨浏览器的方式这样做,那么使用像jQuery这样的库是一种选择吗?使用jQuery将函数绑定到表单的onsubmit事件并让该处理程序调用.preventDefault()将在所有支持的浏览器中完成相同的操作。此外,您可以使用jQuery事件对象的.isDefaultPrevented()方法来确定事件是否已被取消,可能是通过lhs = e.returnValue完成您正在尝试的事件。

#2

Here's the kludge way around this. I was hoping for a clean standards compliant method, but it appears there is none.

这是围绕这个的kludge方式。我希望有一个符合标准的清洁方法,但似乎没有。

function onSubmitHandler()
{
    // only called if the other onsubmit handlers succeed
}

// hook in submit
var originalOnSubmit = form.onsubmit;

form.onsubmit = function(e)
{
    var ret;

    if (originalOnSubmit)
        ret = originalOnSubmit();

    if (ret != false)
    {
        return onSubmitHandler(e);
    }
};

#1