如果用户尝试离开网页，如何提示未保存的更改

Question

  

可能重复：
  How do I stop a page from unloading (navigating away) in JS?
  Prompt user for unsaved changes when leaving webpage

我有一个php格式，我在Dreamweaver中设计，只包含文本字段，从我的数据库中一次检索一条记录。我在此页面上还有一个“更新记录”按钮，当单击该按钮时，会更新数据库记录，并对表单中的数据进行任何更改。我希望如果用户以某种方式编辑表单数据并尝试离开页面而不单击“更新记录”按钮，则会提示他们页面包含未保存的更改，并且会要求他们验证是否要离开或不（如果可能的话，可能通过一些javasript）。

非常感谢任何帮助。

Answer 1

导航实际开始之前发生

onbeforeunload，您可以使用一种相当独特的方法停止导航：只需返回您想要在对话框中显示的字符串，浏览器就会询问用户是否< em>真的想要离开页面。

如果您没有返回字符串，浏览器会继续正常导航。例如，您可以使用此行为仅在用户未保存更改时显示提示。

window.onbeforeunload = function(e) {
    if (unsavedChanges) return 'Dialog text here.';
};

您只能通过返回字符串并让浏览器提示来停止导航。在alert中实际上禁止拨打confirm或onbeforeunload，在onunload中，您无法实际停止导航。

Answer 2

使用unload方法和jquery的“on”api。

 var flag = true; // set this var according to your use.
 $(window).on('beforeunload', function(){
     if(flag) {
        return "It looks like you have input you haven't submitted."
      }
 });