DEV Community

Phong Duong
Phong Duong

Posted on • Originally published at phongduong.dev on

Alert when user leaves the web page

To know when users leave the web page, you listen to beforeunload. This event is fired before the window is unloaded.

It is because of the browser's support. In the event handler, you can call preventDefault() on the event, assign a string to the event's returnValue property and return a string. You should combine these methods if your web page runs on multiple browsers.

window.addEventListener('beforeunload', (event) => {
  event.preventDefault();
  event.returnValue = '';
});
Enter fullscreen mode Exit fullscreen mode

When the user tries to leave the page like refreshing, closing the tab, or going back, it is going to show a confirm dialog.

Top comments (0)