1

I read these two questions:

How can I detect browser tab refresh or close using javascript

and

How do I detect a page refresh using jquery?

which suggest binding to 'onbeforeunload' and also binding on F5 and Ctrl-R key presses, which is good advice.

However, most browsers have a refresh button on their address bars, like this in Chrome:

enter image description here

Question is: is it possible to detect and bind to refresh event of browser's address bar's refresh button?

Community
  • 1
  • 1
Mefhisto1
  • 2,188
  • 7
  • 34
  • 73
  • onbeforeunload should fire when pressing the refresh button (or pressing enter at the address bar). – Sebastian Brand Apr 15 '16 at 08:09
  • If you have an `beforeunload` event that is not triggered by `F5` or `Ctrl-5` there is a high chance it is triggered via the reload button you mentioned. – Pierre C. Apr 15 '16 at 08:10

1 Answers1

2

By binding onbeforeunload to windowlike this window.onbeforeunload it should trigger in most browsers. check this fiddle. It seems it's not supported on IOS devices.

For IOS apple docs suggest using pagehide see apple page on Handling Events.

The load and unload events may not work as expected for back and forward optimization. Use the pageshow and pagehide events instead.

Keep in mind that this will also trigger on all other kinds of navigation away from the page. Such as close, tab close, back/ forward navigation, link navigation and address bar navigation

Checking if the browser is reloading versus navigating away from the page I'm pretty confident is not possible, due to security/ privacy reasons not being able to give you the destination url. You could eliminate link presses by using it is an condition when firing the onbeforeunload.

Edit: If you need to check if the page has been reloaded however, you could use sessionvariables or cookies to store that the user has already opened the page once before.

sankorati
  • 137
  • 12