手动刷新页面时如何取消浏览器关闭/刷新确认模式？

Question

I have the browser show confirm modal when the user clicks the browser's refresh or close buttons with the code below:

window.onbeforeunload = confirmCloseOrRefresh;
function confirmCloseOrRefresh() {
   var confirmMessage = confirm('Are you sure to exit?');
   return confirmMessage;
}

Now, I have a custom refresh button on my page which I want to manually refresh the page without showing the confirm modal.

I tried this:

onRefreshButtonClick(event) {
   event.preventDefault();
   window.location.reload();
   return true;
}

Still shows the confirm modal. Any way to cancel/override the confirm modal in this function?

Answer 1

You could simply introduce a global Boolean variable restrictUnload which you check in your confirmCloseOrRefresh function:

var restrictUnload = true;

function confirmCloseOrRefresh() {
   if (restrictUnload) {
     var confirmMessage = confirm('Are you sure to exit?');
     return confirmMessage;
   } else {
     return true;
   }
}

In your onRefreshButtonClick function, simply set that variable to false :

onRefreshButtonClick(event) {
   restrictUnload = false;
   event.preventDefault();
   window.location.reload();
   return true;
}