Question

我正在寻找一种警告用户，如果他们在提交完成的表单之前从多页表单中导航（关闭浏览器，单击后退按钮）的话。表单中位于不同页面路由上的每个部分都保存在 SessionStorage 中。

我正在使用 onbeforeunload 事件来触发“未保存的更改”对话框，但是，除非用户与页面进行交互并且因此，不会检查条件（如果存在SessionStorage，则返回对话框），并且不会显示该对话框。

任何其他选择，建议或智慧都值得赞赏！

// Display dialog when user navigates away without submitting form
// isStoredData condition is never met in Chrome unless user interacts with page
window.onbeforeunload = function () {
  let isStoredData = sessionStorage.getItem("MyFormDataInSessionStorage");
  let isDirty = $scope.MyForm.$dirty;
  if (isDirty || isStoredData) {
    return "Your application will not be saved.";
  }
  return undefined; 
};

// Prevent unsaved changes dialog when form is submitted
$('form').submit(function () {
  window.onbeforeunload = undefined;
});

Answer 1

您应使用$（window）.on，如以下代码段所示：

$(window).on('beforeunload', function() {
   //Write your logic here.
});

在SessionStorage中未保存的更改时警告用户

1 个答案: