javascript - 如果用户在页面上输入内容但未保存则显示消息

Question

如果用户输入了一些内容但未保存并尝试离开页面，我如何显示类似弹出模式的消息？

类似于:

如果您尝试转到 Facebook 中的另一个页面，但如果您输入 URL，则会出现 native 警告框，例如:

1.) 有什么区别？警报是内置于浏览器中的东西吗？

2.) 当类似事件发生时，我如何使用 jQuery 创建我自己的自定义模式框？

谢谢

Answer 1

试试这个

window.onbeforeunload = function(evt){

    //Show you custom confirm dialog box here
    //Inside the confirm dialog box if the use say YES leave the page
    //Then you should set `window.onbeforeunload` to null and
    //redirect to required location so that it will not ask again.
    var dialog = $('#confirmDialog').dialog('open');

    //This will prevent the default dialog box of the browser.
    return false;
}

参见 MSDN article on onbeforeunload