如何知道用户是否在Javascript onbeforeunload对话框上点击取消？

当有人试图从特定页面导航而未保存其工作时，我弹出一个对话框。我使用Javascript的onbeforeunload事件，效果很好。如何知道用户是否在Javascript onbeforeunload对话框上点击取消？

现在我想运行一些Javascript代码，当用户点击“取消”对话框出现（说他们不想离开页面）。

这可能吗？我也使用jQuery，所以有可能像beforeunloadcancel我可以绑定到一个事件？

UPDATE：我们的想法是实际保存，并将用户指向不同的网页，如果他们选择取消

来源

2011-01-10 at.

我不认为这是可能的......但我希望我错了。 – keithjgrant 2011-01-10 19:45:34

我很好奇你如何用自定义对话框阻止导航器。你能提供代码吗？ – jAndy 2011-01-10 19:46:39

@jAndy，在Javascript中查找onbeforeunload事件，它正是如此。 – 2011-01-10 19:55:31

你可以这样说：

$(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，它会在大约一秒内触发。如果用户确认无误，用户将重定向，并且第二个setTimeout永远不会被触发。

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

来源

2011-01-10 20:15:22 jAndy

我去了链接，但关闭窗口时什么都没有发生。使用Chrome浏览器... – 2011-01-10 20:34:51

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

来源

2011-01-10 19:45:45

这个想法是，如果他们选择取消，实际上然后保存并引导他们到不同的网页。 – 2011-01-10 19:54:59

我不认为这是可能的，但只是尝试这样的想法和它的作品（虽然这是一些黑客攻击的是什么，并在所有的浏览器可能不工作方式相同）：

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

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

来源

2011-01-13 23:52:15

我知道这个问题是老了，但如果有些人还是有这个问题，我发现似乎为我工作的一个解决方案，

基本上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 here

来源

2014-09-10 12:44:10

-5

window.onbeforeunload = function() { 
    if (confirm('Do you want to navigate away from this page?')) { 
     alert('Saving work...(OK clicked)') 
    } else { 
     alert('Saving work...(canceled clicked)') 
     return false 
    } 
}

与此代码另外，如果在IE8的“取消”用户点击将出现默认导航对话框。

来源

2014-11-26 11:30:40 jyoti

如何知道用户是否在Javascript onbeforeunload对话框上点击取消？

回答

相关问题