javascript 如何防止“您确定要离开此页面吗？” 提交表单时发出警报？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11183682/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to prevent "Are you sure you want to navigate away from this page?" alert on form submission?
提问by ashishjmeshram
I have a simple html form with few fields in it.
我有一个简单的 html 表单，其中包含几个字段。
I wanted to make sure that user gets an alert message when he is trying to leave the page. So I added the script on the page which will run whenever user is trying to navigate away from this page.
我想确保用户在尝试离开页面时收到警报消息。因此，我在页面上添加了脚本，该脚本将在用户尝试离开此页面时运行。
But I am also getting this alert message when user is trying to submit the form. I dont want this alert message when user is saving the form.
但是当用户尝试提交表单时，我也会收到此警报消息。当用户保存表单时，我不想要此警报消息。
Please help.
请帮忙。
Below is some sample code.
下面是一些示例代码。
<html>
<head>
<script>
function verifyexit() { return 'Are you sure ?'; } window.onbeforeunload = verifyexit;
</script>
</head>
<body>
Go to <a href="b.html"> another page </a>
<form action="c.html">
name : <input type="text" name="name" value=""/> <br>
email : <input type="text" name="email" value=""/> <br>
<input type="submit" value="save"/>
</form>
</body>
回答by shareef
To turn it on:
打开它：
window.onbeforeunload = "Are you sure you want to leave?";
To turn it off:
要关闭它：
window.onbeforeunload = null;
Bear in mind that this isn't a normal event - you can't bind to it in the standard way.
请记住，这不是正常事件 - 您无法以标准方式绑定到它。
To check for values? That depends on your validation framework.
检查值？这取决于您的验证框架。
In jQuery this could be something like (very basic example):
在 jQuery 中，这可能类似于（非常基本的示例）：
$('input').change(function() {
if( $(this).val() != "" )
window.onbeforeunload = "Are you sure you want to leave?";
});
With JQuerythis stuff is pretty easy to do. Since you can bindto sets.
使用 JQuery，这件事很容易做到。因为你可以绑定到集合。
Its NOT enough to do the onbeforeunload, you want to only trigger the navigate away if someone started editing stuff.
仅执行 onbeforeunload 是不够的，您只想在有人开始编辑内容时触发导航。
To make this work in Chrome and Safari, you would have to do it like this
要在 Chrome 和 Safari 中完成这项工作，您必须这样做
window.onbeforeunload = function (e) {
e = e || window.event;
var msg = "Sure you want to leave?";
// For IE and Firefox prior to version 4
if (e) {
e.returnValue = msg;
}
// For Safari
return msg;
};
This is the general rule in reference
这是参考的一般规则
window.onbeforeunload = function (e) {
e = e || window.event;
// For IE<8 and Firefox prior to version 4
if (e) {
e.returnValue = 'Any string';
}
// For Chrome, Safari, IE8+ and Opera 12+
return 'Any string';
};
reference: https://developer.mozilla.org/en/DOM/window.onbeforeunload
参考：https://developer.mozilla.org/en/DOM/window.onbeforeunload
回答by gfreezy
Try this:
试试这个：
$(window).bind("beforeUnload", verify);
$("form").submit(function (){
$(window).unbind("beforeUnload");
};
回答by Sean Johnson
Try this:
试试这个：
<form action="c.html" onsubmit="window.onbeforeunload=function(){}">
回答by Team-JoKi
试试这个：http: //cfsilence.com/blog/client/index.cfm/2009/10/12/jQuery-Method-To-Prompt-A-User-To-Save-Changes-Before-Leaving-Page
I added another bit to the function:
我在函数中又添加了一点：
$('#submitButton').click(function () {
isDirty = false;
});
Just so the form doesn't ask for validation when you want to submit it :)
当您想提交表单时，表单不会要求验证:)
I hope this helps
我希望这有帮助
Note: You could also do something like $("input[type=submit]") if you don't like to depend on a common naming (else your submit button needs to be called submitButton)
注意：如果您不喜欢依赖通用命名，您也可以执行类似 $("input[type=submit]") 的操作（否则您的提交按钮需要被称为 submitButton）
