在这里的stackoverflow，如果你开始做改变，然后你试图导航离开页面，一个javascript确认按钮显示，并询问:“你确定你想导航离开这个页面吗?”
以前有人实现过这个吗?我如何跟踪已提交的更改?
我相信我自己可以做到这一点，我正在努力从你们这些专家那里学习好的做法。
我尝试了以下方法，但仍然不起作用:
<html>
<body>
<p>Close the page to trigger the onunload event.</p>
<script type="text/javascript">
var changes = false;
window.onbeforeunload = function() {
if (changes)
{
var message = "Are you sure you want to navigate away from this page?\n\nYou have started writing or editing a post.\n\nPress OK to continue or Cancel to stay on the current page.";
if (confirm(message)) return true;
else return false;
}
}
</script>
<input type='text' onchange='changes=true;'> </input>
</body>
</html>
有人能举个例子吗?
从webapi ->WindowEventHandler->onbeforeunload，它建议使用window.addEventListener()和beforeunload事件，而不是onbeforeunload。
语法的例子
window.addEventListener("beforeunload", function(event) { ... });
window.onbeforeunload = function(event) { ... };
注意:HTML规范规定作者应该使用Event. preventdefault()方法而不是使用Event。returnValue来提示用户。
所以，就你的情况而言，代码应该是这样的:
//javascript
window..addEventListener("beforeunload", function(event) {
//your code
// If you prevent default behaviour in Mozilla Firefox prompt will always be shown
e.preventDefault();
// Chrome requires returnValue to be set
e.returnValue = '';
})
从webapi ->WindowEventHandler->onbeforeunload，它建议使用window.addEventListener()和beforeunload事件，而不是onbeforeunload。
语法的例子
window.addEventListener("beforeunload", function(event) { ... });
window.onbeforeunload = function(event) { ... };
注意:HTML规范规定作者应该使用Event. preventdefault()方法而不是使用Event。returnValue来提示用户。
所以，就你的情况而言，代码应该是这样的:
//javascript
window..addEventListener("beforeunload", function(event) {
//your code
// If you prevent default behaviour in Mozilla Firefox prompt will always be shown
e.preventDefault();
// Chrome requires returnValue to be set
e.returnValue = '';
})
如果表单中输入了任何数据，这是一种简单的显示消息的方法，如果表单已提交，则不显示消息:
$(function () {
$("input, textarea, select").on("input change", function() {
window.onbeforeunload = window.onbeforeunload || function (e) {
return "You have unsaved changes. Do you want to leave this page and lose your changes?";
};
});
$("form").on("submit", function() {
window.onbeforeunload = null;
});
})
