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

时间:2017-10-14 05:44:03

标签: javascript angularjs angularjs-material

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

我使用了显示与谷歌浏览器相关的预定义确认框的window.onbeforeunload事件。当用户更改任何表单并尝试重新加载,选项卡关闭或路由更改时,我想显示$ mdDialog.confirm并要求用户离开页面或保持在同一页面上。我该怎么做?

1 个答案:

答案 0 :(得分:1)

出于安全原因,无法做到这一点。您可以在beforeunload event上的MDN页面中找到更多详细信息。

过去,您可以返回显示给用户的自定义字符串,但这些日子甚至会被忽略。您可以做的最好的事情是指示页面显示您已有的标准对话框。 (在某些浏览器和某些场景中,甚至可能会忽略该指令。)

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