I'm trying to activate a page reloader preventer, and be able to deactivate the reloader preventer. In other words, I was able to show a dialog when user was about to unload/reload their page, but I'm currently looking for a way to let the user to unload/reload their page without any dialogs or warnings after a certain function has been called.
Maybe removing the event listener will help?
This is the code that I'm working with:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<button onclick="activateReloader()">activate</button>
<button onclick="deactivateReloader()">deactivate</button>
<script>
function activateReloader() {
window.addEventListener('beforeunload', function (e) {
// Cancel the event
e.preventDefault();
// Chrome requires returnValue to be set
e.returnValue = '';
});
}
function deactivateReloader() {
window.removeEventListener('beforeunload', function (e) {});
}
</script>
</body>
</html>