admin管理员组

文章数量:1291253

I have a strange issue from a client in that our code, which they include uses onbeforeunload() to trigger a dialog, but they are also including another panies code which also binds this event handler.

Is it possible for both to execute at the same time?

I've been reading this, "JavaScript: The Definitive Guide, Fifth Edition" to try and help better understand what is happening in the browsers internals and the Javascript stack, but it's proving quite mind bending.

I understand from reading the book that some events can be executed all at the same time if they are attached using the Level 2 API addEventListener() but the order will be up to the browser. However there is no mention of the onbeforeunload() event. Just the onunload().

Which leads me to the second part of the question. If an event is triggered in onbeforeunload() am I right in thinking that unless it returns true, the onunload() will never be called?

If anyone can shed some light on it, or hook me up with a nice tutorial/guide on either having multiple event handlers assigned to the same event, or specifically on these two events that would be ace.

I have a strange issue from a client in that our code, which they include uses onbeforeunload() to trigger a dialog, but they are also including another panies code which also binds this event handler.

Is it possible for both to execute at the same time?

I've been reading this, http://oreilly./catalog/9780596101992 "JavaScript: The Definitive Guide, Fifth Edition" to try and help better understand what is happening in the browsers internals and the Javascript stack, but it's proving quite mind bending.

I understand from reading the book that some events can be executed all at the same time if they are attached using the Level 2 API addEventListener() but the order will be up to the browser. However there is no mention of the onbeforeunload() event. Just the onunload().

Which leads me to the second part of the question. If an event is triggered in onbeforeunload() am I right in thinking that unless it returns true, the onunload() will never be called?

If anyone can shed some light on it, or hook me up with a nice tutorial/guide on either having multiple event handlers assigned to the same event, or specifically on these two events that would be ace.

  • javascript
  • dom-events
  • onbeforeunload
Share Improve this question edited Feb 26, 2020 at 19:16 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked May 12, 2010 at 14:37 David YellDavid Yell 11.9k13 gold badges64 silver badges102 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 8

Is it possible for both to execute at the same time?

Not literally at the same time, no — Javascript in browsers is (currently) single-threaded. So there can be multiple handlers for the onbeforeunload event, but they'll be called serially, not simultaneously. At least in theory; in practice, it looks like only one of them is called (see below).

If an event is triggered in onbeforeunload() am I right in thinking that unless it returns true, the onunload() will never be called?

If any onbeforeunload handler cancels the unload, no onunload handler will be called. You cancel the unload by doing two things (because browsers differ here): First, you assign a string to the returnValue property of the event object, and then you return that string out of the function. Details here and here. (The string is used as a prompt, allowing the user to decide whether to cancel the unload.)

Quick Test

So much for theory, let's look at what actually happens:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>Test Page</title>
<style type='text/css'>
body {
    font-family: sans-serif;
}
</style>
<script type='text/javascript'>
window.onload = pageInit;
function pageInit() {
    hook(window, 'beforeunload', beforeUnload1);
    hook(window, 'beforeunload', beforeUnload2);
    hook(window, 'unload', unload1);
    hook(window, 'unload', unload2);
}

function beforeUnload1(event) {
    var s;

    event = event || window.event;
    s = "Message from beforeUnload1";
    event.returnValue = s
    return s;
}

function beforeUnload2(event) {
    var s;

    event = event || window.event;
    s = "Message from beforeUnload2";
    event.returnValue = s
    return s;
}

function unload1(event) {
    alert("Message from unload1");
}

function unload2(event) {
    alert("Message from unload2");
}

var hook = (function() {
    var d;

    function hookViaAttachEvent(obj, eventName, handler) {
        obj.attachEvent('on' + eventName, handler);
    }
    function hookViaAddEventListener(obj, eventName, handler) {
        obj.addEventListener(eventName, handler, false);
    }

    d = document.createElement('span');
    if (d.addEventListener) {
        return hookViaAddEventListener;
    }
    else if (d.attachEvent) {
        return hookViaAttachEvent;
    }
    throw "Neither attachEvent nor addEventListener found.";
})();
function hook(eventName, handler) {

}
</script>
</head>
<body></body>
</html>

On Chrome, IE, and Firefox, I only ever see a notification from one of the onbeforeunload handlers, even when I say it's okay to go ahead and leave. I expect this is probably because otherwise, a sufficiently-irritating page could just register a bunch of handlers and keep nagging the user to stay on the page.

After the (one) question, if I allow navigation to continue, I get both unload messages.

本文标签： javascriptMultiple onbeforeunload() and onunload() eventsStack Overflow

版权声明：本文标题：javascript - Multiple onbeforeunload() and onunload() events - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741529133a2383647.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。