ISO in some ways in order to pursue a better customer experience is really great, but also make it unlike other browsers, so that developers have a headache.
For example, recently made a project, but can not share, but there is a very bad effect, in the current page is forbidden to share, but the current page to
The next page back to the previous page has a sharing function, which is the safari special caching mechanism effect, is a bit like a single page
Apps can switch pages back and forth instead of refreshing page parts, like Android, although there's a caching mechanism, but it's just caching
Some features, such as scrolling height, it will still execute the JS file, but the ISO is not so, it is tentative page function, when you switch back will continue
Execute the last execution of the code, such as I set a timer on the page, when the switch back will continue to execute the last time.
All Safari encourages us to use the Window.onpageshow event to trigger some code that needs to be executed for switching back, such as triggering a built-in method,
Because this method is like Android, it will refresh the function, so you need to trigger some built-in methods to change back to the desired effect of the initial page.
Information: Portal This information or foreign comparison, the domestic data most of some rubbish, there is no comprehensiveness, and the method of a unified bug.
If used in conjunction with Popstate,pushstate, this also has a big pit is the Refresh page will appear two times back to back ....
And foreign have popstate,pushstate, browser local cache with use ... The logic of this method is very complex
Popstate,replacestate this is relatively simple.
There is pageshow,persisted, this good
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title>Pageshow Test</title> <Metaname= "Viewport"content= "Width=device-width, initial-scale=1.0,maximum-scale=1.0, User-scalable=no"/> <Scriptsrc= "Jquery-3.1.0.min.js"></Script> <Linkrel= "stylesheet"href= "Jquery-ui-1.12.1/jquery-ui.css"> <Scriptsrc= "Jquery-ui-1.12.1/jquery-ui.js"></Script> <style>. b{Margin-top:300px;Height:1000px; }Button{width:100%;Height:30px; }Button A{width:100%;Display:Block; } </style></Head><Body> <Divclass= "B"> <PID= "Times"><span>Count:</span><spanID= "T"></span></P> <Button><ahref= "2.html">Pagehide Test</a></Button> <PID= "P"></P> <PID= "P3"></P> <PID= "P4"></P> </Div> <Script> varI=0; SetInterval (function() {i++; $("#t"). html (i); }, +); $ (window). On ("Pageshow",function(Event) {$ ("#p4"). HTML ("whether to cache:"+event.originalEvent.persisted); $("#p3"). HTML ('Pageshow'); Weixinjsbridge.call ('Hidetoolbar'); Weixinjsbridge.call ('Hideoptionmenu'); $("#p"). HTML ('Weixinjsbridgeready'+i); }); Document.addeventlistener ('Weixinjsbridgeready', functionOnbridgeready () {Weixinjsbridge.call ('Hidetoolbar'); Weixinjsbridge.call ('Hideoptionmenu'); $("#p"). HTML ('Weixinjsbridgeready'); }); functionIsios () {varu=navigator.useragent; varisweixin=U.indexof ('Micromessenger') > -1; // varIsios= !!U.match (/\ (i[^;] +;( U;)? Cpu.+mac OS X/); //iOS terminal if(Isweixin&&Isios) { return true; }Else{ return false; } } </Script></Body></HTML>
Onpageshow and Onpagehide
The event object also contains the persisted property
ISO Mobile Safari Page cache