onbeforeunload 确认屏幕自定义
-
20-09-2019 - |
题
是否可以在浏览器中为 onbeforeunload 事件创建自定义确认框?我尝试过,但随后我收到了 2 个确认框(其中一个来自我,只不过是返回确认...然后是浏览器中的标准版本)。
目前我的代码如下所示:
var inputChanged = false;
$(window).load(function() {
window.onbeforeunload = navigateAway;
$(':input').bind('change', function() { inputChanged = true; });
});
function navigateAway(){
if(inputChanged){
return 'Are you sure you want to navigate away?';
}
}
我为此使用 jQuery。
解决方案
window.onbeforeunload = function (e) {
var message = "Your confirmation message goes here.",
e = e || window.event;
// For IE and Firefox
if (e) {
e.returnValue = message;
}
// For Safari
return message;
};
请注意:大多数浏览器把这个消息后,一些其他的文字。您没有确认对话框的内容的完全控制。
其他提示
没有,你不能避免来自浏览器的标准之一。所有你能做的就是注入一些自定义文本到它;如果使用下列事件处理程序(注册原型LIB方式):
Event.observe(window, "beforeunload", function(event) {
if (showMyBeforeUnloadConfirmation)
event.returnValue = "foo bar baz";
});
(和showMyBeforeUnloadConfirmation
是真实的),你会得到浏览器的标准确认与下面的文字:
您确定要离开此页面吗?
FOO酒吧巴兹
按确定继续,或取消留在当前页面。
[OK] [取消]
我遇到了同样的问题,我能够使用我的消息获得自己的对话框,但我面临的问题是:
- 它在所有导航上都会发出消息,而我只需要关闭单击即可。
- 使用我自己的确认消息,如果用户选择“取消”,它仍然显示浏览器的默认对话框。
以下是我找到的解决方案代码,我将其写在我的母版页上。
function closeMe(evt) {
if (typeof evt == 'undefined') {
evt = window.event;
}
if (evt && evt.clientX >= (window.event.screenX - 150) && evt.clientY >= -150 && evt.clientY <= 0) {
return "Do you want to log out of your current session?";
}
}
window.onbeforeunload = closeMe;
不隶属于 StackOverflow