Cancel/remove/disable beforeunload eventlistener if AJAX 响应成功

Question

在我的 Android 网络应用程序页面中，如果错误刷新页面，浏览器会警告用户：

<script>
    window.onbeforeunload = function(e) {
       var dialogText = 'Dialog text here';
       e.returnValue = dialogText;
       return dialogText;
    };
</script>

效果很好。 但是在我的 AJAX 调用中（如果保存过程成功）我会自动将用户重定向到主页。 （用户不应停留在同一页面）我的工作代码是：

$.ajax({
       url: '{{ url()->current() }}',
       type: 'POST',
       data: $('#mainForm').serializeArray(),
       beforeSend: function (xhr) {
              $.LoadingOverlay("show");
       },
       error: function(xhr,status,error){ 
              $.LoadingOverlay("hide");
              swal('Error','bla bla bla!', 'error');
       },
       success: function(result, status, xhr){
              if(result.hasOwnProperty('success')){ 
                   /* Here i want to disable beforeunload */
                   window.location.href = "{{ url('m') }}";
              }else if(result.hasOwnProperty('error')){
                   swal('Error',result.error, 'error');
              }else{
                   swal('Error',"bla bla bla ", 'error');
              }
       },
       complete: function(xhr){
              $.LoadingOverlay("hide");
       }
 });

在成功的情况下，我不希望用户决定保留此页面或重定向到新位置。我想自动将用户重定向到新位置。

我试过this解决方案：

window.onbeforeunload = function () {
  // blank function do nothing
}

或

window.onbeforeunload = null;

或

function functionToRun(e){
     if(sessionStorage.token != "abide" ){
        // call api
     }
}

window.removeEventListener("beforeunload",functionToRun);

我无法解决我的问题。

Answer 1

removeEventListener 应该可以，但您应该将 beforeunload 处理程序命名为：

function onBeforeUnload(e) {
    var dialogText = 'Dialog text here';
    e.returnValue = dialogText;
    return dialogText;
};    
window.addEventListener('beforeunload', onBeforeUnload);

并且在您的 success 回调中：

window.removeEventListener('beforeunload', onBeforeUnload);