在某些内容项较多的表单页面,为防止用户误操作离开页面导致输入内容丢失,一般会在该页面刷新、关闭或跳转时弹出一个确认提示框(如下图):

用户可以选择“取消”而继续留在当前页面。想要实现这个功能,需要用到 beforeunload 事件,它会在页面卸载前触发。
window.addEventListener('beforeunload', function(e) {
var msg = '你真的要走啊?';
(e || window.event).returnValue = msg; // Gecko and Trident
return msg; // Gecko and WebKit
});
需要注意的是,除了 IE 外,Chrome 和 Firefox 浏览器都不会显示自定义的提示语(上面 msg 定义的文案),只要 returnValue 赋值为非空字符串,浏览器就会弹出一个对话框,如果没有赋值,该事件不作任何响应。
beforeunload