3

The iOS Safari doesnt't seem to trigger pageshow event in the following situation.

Lets say I have 3 pages

  • Page A : (has some code code on pageshow event)
  • Page B
  • Page C

User navigates from A -> B. Presses the back button. (pageshow triggers fine)
User then navigates to another page could be Page B or Page C. Then presses the back button again. (pageshow doesn't trigger)

On the contrary if the user minimizes and maximizes the window again or switches to another window and back (by pressing the middle button on iPhone) the pageshow event is triggered again.

Everything seems to work fine on Android

window.onpageshow = function(e) { alert('hello'); }

Did anyone else face it? I spent hours on this thing and couldn't think of a workaround.

Any help would be greatly appreciated.

7
  • Maybe this stackoverflow.com/questions/11979156/mobile-safari-back-button answer will helpful for you Commented Feb 27, 2015 at 9:13
  • stackoverflow.com/questions/20899274/… Commented Oct 31, 2015 at 9:32
  • 1
    Did you fix this? I'm facing the same issue on iOS 9.3 Commented May 3, 2016 at 14:17
  • @JorgeRamírez: yes, long ago. I don't remember on top of my head but there are 2 different events one that works fine in Android and one that works properly in iOS. One is pageshow and I don't remember the other one. So based on UserAgent I add my event handle to that event. Try pageinit, pagebeforeshow, pageshow etc. Commented May 3, 2016 at 17:21
  • Thanks for your response but unfortunately I already tried all those events without any luck Commented May 3, 2016 at 17:34

3 Answers 3

2

Hack : This is what worked for me

var myCustomEvent = (navigator.userAgent.match('iPhone') != null) ? 'popstate' : 'pageshow'; $(window).on(myCustomEvent, function(e) { ... } 

For some reason popstate triggers everytime when page state changes in iOS but not in Android.

Sign up to request clarification or add additional context in comments.

2 Comments

After a while testing a lot of solutions, this code finally seems to be the definitive solution, in my case is working on Safari 9.1 (iOS 9.3). Advice for people facing this: Be sure to clear your browser's cache on client and restart the site on the server.
Works like a charm on iOS 10!
0

Try using:

window.onpageshow = function(event) { if (!event.persisted) { alert("hello"); } }; 

Persisted is false on initial page load, so you can check against it, and if it false, it is your first page load.

Comments

0

The popstate event doesn't seem to work any more, at least for me. I worked out some third-party script on my page was breaking this, but wasn't able to work out which one. I came up with this hack:

addEventListener('pageshow', () => { history.replaceState({}, document.title, window.location.pathname); // called on initial load and first back }); addEventListener('popstate', () => { // called on all back events }); 

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.