Prevent Any Form of Page Refresh Using Jquery/Javascript

Prevent any form of page refresh using jQuery/Javascript

#1 can be implemented via window.onbeforeunload.

For example:

<script type="text/javascript">
window.onbeforeunload = function() {
return "Dude, are you sure you want to leave? Think of the kittens!";
}
</script>

The user will be prompted with the message, and given an option to stay on the page or continue on their way. This is becoming more common. Stack Overflow does this if you try to navigate away from a page while you are typing a post. You can't completely stop the user from reloading, but you can make it sound real scary if they do.

#2 is more or less impossible. Even if you tracked sessions and user logins, you still wouldn't be able to guarantee that you were detecting a second tab correctly. For example, maybe I have one window open, then close it. Now I open a new window. You would likely detect that as a second tab, even though I already closed the first one. Now your user can't access the first window because they closed it, and they can't access the second window because you're denying them.

In fact, my bank's online system tries real hard to do #2, and the situation described above happens all the time. I usually have to wait until the server-side session expires before I can use the banking system again.

Avoid page reload and when press reload using Javascript/JQuery

You can't really prevent the user from reloading, as it is a default behavior of the browser, what you can do is store the timer value somewhere (a backend server or localstorage) and then fetch the value from there during each session

// you cannot run this snippet here because of stack security reasons
let timerValue = localStorage.getItem('timer') || 10; // if timer value is not found then it should be 10 seconds by default

const wait = (ms) => new Promise(r => setTimeout(r, ms));

run();

async function run() {
console.log('timer has begun');
while(true) {
if (timerValue <= 0) break;
timerValue--;
localStorage.setItem('timer', timerValue);
await wait(1000);
}

console.log('timer has ended');
localStorage.setItem('timer', null); // reset timer once the test is finished
}

Prevent User to reload page using jquery or javascript

No, you can't. If a user wants to reload a page you cannot stop them.



Related Topics



Leave a reply



Submit