javascript - 当用户离开页面时在 angularjs 中显示自定义确认框

Question

我的要求是在用户离开页面时未保存表单数据时显示自定义确认框。

我使用了 window.onbeforeunload 事件，它显示了谷歌浏览器相关的预定义确认框。当用户更改任何表单并尝试重新加载、选项卡关闭或路由更改时，我想显示 $mdDialog.confirm 并要求用户离开页面或留在同一页面上。我如何制作一个？

Answer 1

出于安全原因，不能这样做。您可以在 beforeunload event 的 MDN 页面中找到更多详细信息。 .

过去，您可以返回一个显示给用户的自定义字符串，但现在即使这样也被忽略了。您能做的最好的事情就是指示页面显示您已有的标准对话框。 (并且在某些浏览器和某些场景中，甚至可能会忽略该指令。)

另一种方法是在页面中包含一个用于离开表单的按钮。虽然这仍然不能阻止用户直接离开页面，但如果它足够明显，在许多情况下用户更有可能点击它而不是直接导航。它还可以作为被动提醒，提醒您表单需要明确保存或取消(当然，取决于您的具体细节)。