你可以这样做：

$(function() {
    $(window).bind('beforeunload', function() {
        setTimeout(function() {
            setTimeout(function() {
                $(document.body).css('background-color', 'red');
            }, 1000);
        },1);
        return 'are you sure';
    });
}); 

第setTimeout一种方法中的代码有 1 毫秒的延迟。这只是将函数添加到UI queue. 由于setTimeout异步运行，Javascript 解释器将通过直接调用return语句继续运行，进而触发浏览器modal dialog。这将阻塞UI queue并且setTimeout不会执行第一个代码，直到模态关闭。如果用户按下取消，它将触发另一个 setTimeout，它会在大约一秒钟内触发。如果用户确认 ok，用户将重定向并且永远不会触发第二个 setTimeout。

示例：http : //www.jsfiddle.net/NdyGJ/2/

我知道这个问题现在已经过时了，但是如果有人仍然对此有疑问，我找到了一个似乎对我有用的解决方案，

基本上unload事件是在beforeunload事件发生后触发的。我们可以用它来取消beforeunload事件中创建的超时，修改jAndy的回答：

$(function() {
    var beforeUnloadTimeout = 0 ;
    $(window).bind('beforeunload', function()  {
        console.log('beforeunload');
        beforeUnloadTimeout = setTimeout(function() {
            console.log('settimeout function');
            $(document.body).css('background-color', 'red');
        },500);
        return 'are you sure';
    });
    $(window).bind('unload', function() {
        console.log('unload');
        if(typeof beforeUnloadTimeout !=='undefined' && beforeUnloadTimeout != 0)
            clearTimeout(beforeUnloadTimeout);
    });
}); 

编辑： jsfiddle在这里

不可能。也许有人会证明我错了...你想运行什么代码？你想在他们点击取消时自动保存吗？这听起来违反直觉。如果你还没有自动保存，我认为当他们点击“取消”时自动保存没有意义。也许您可以在 onbeforeunload 处理程序中突出显示保存按钮，以便用户在导航离开之前看到他们需要做什么。

我不认为这是可能的，但只是尝试了这个想法并且它有效（尽管它是一种黑客行为，并且可能无法在所有浏览器中正常工作）：

window.onbeforeunload = function () {   
  $('body').mousemove(checkunload);
  return "Sure thing"; 
};

function checkunload() {   
  $('body').unbind("mousemove");
  //ADD CODE TO RUN IF CANCEL WAS CLICKED
}

另一种变体 第一个 setTimeout 等待用户响应浏览器的离开/取消弹出窗口。第二个setTimeout等待1秒，然后CancelSelected只有在用户取消时才会调用。否则页面将被卸载并且 setTimeout 丢失。

window.onbeforeunload  = function(e) {
    e.returnValue = "message to user";
    setTimeout(function () { setTimeout(CancelSelected, 1000); }, 100);
}

function CancelSelected() {
    alert("User selected stay/cancel");
}