微信中苹果h5页面用window.history.go(-1)返回上一页页面不会重新加载/刷新

微信中h5页面用window.history.go(-1)返回上一页页面不会重新加载问题问题描述：在实际开发中遇到这样一个问题，业务需求涉及到返回上一页问题，第一时间想到了window.history.go(-1)方法，这样做本身没有任何问题，但是在微信中，安卓手机还好返回上一页页面会重新加载，而ios却不会重新加载页面，这就很难受了。解决方案：网上查阅了很多资料发现很多方法都不可行，那些方法就不一一展示了，直接上最终代码。window.addEventListener('pageshow', function(e) {// 通过persisted属性判断是否存在 BF Cacheif (e.persisted) {location.reload();}
});因为我做的逻辑是在下一个要页面，进行存储咋 sesstion 里面，然后window.history.go(-1) 返回获取赋值，因为IOS 返回无法重现加载，利用上面代码进行了下修改window.addEventListener('pageshow', function(e) {// 通过persisted属性判断是否存在 BF Cacheif (e.persisted) {var objData=JSON.parse(sessionStorage.getItem('lolData'));if(objData){$('#origin-place').val(objData.start_place); //赋值$('#obj-place').val(objData.end_place); //赋值}}
});这里有人会说直接reload不就行了，因为我页面还有其他页面，要缓存，所以刷新后其他内容就会丢失了原理：pageShow事件在页面显示即会触发，无论页面是否来自BF Cache。通过检测persisted属性即可判断是否存在 BF Cache 行为。
优点：大部分浏览器都支持pageShow方法与persisted属性，并且需要的代码量只需要短短4行即可。
缺点：每种浏览器中BF Cache的机制是不同的，部分浏览器中的Bf Cache还是会重新执行js代码，会造成重复渲染效果。当然现在我们只考虑Ios中的微信页面， 所以是不存在问题。关于浏览器前进/后退缓存（BF Cache）问题详细参考：http://harttle.land/2017/03/12/backward-forward-cache.html

微信中苹果h5页面用window.history.go(-1)返回上一页页面不会重新加载/刷新相关推荐

js 页面history.back()返回上一页，ios 不重新加载ready的解决办法
项目中,主页面有很多输入字段,当由主页跳转到子页面, 将子页面的字段 set入localstorage中, 由于返回主页面不能将先前输入的字段刷新掉,所以必须要在子页面history.back(). ...
Vue 返回上一页页面不刷新
Vue 返回上一页页面不刷新场景:首页点进列表页时要刷新数据,信息页返回列表页时不刷新数据首先在router.js中配置 {path: '/home',name: 'home',meta: {ti ...
返回上一页页面数据保存
用js写返回上一页是history.go(-1);刷新是location.reload();这两者放一起,就不行了,如果刷新放前边,返回上一页就不会执行,返回上一页放前边,刷新就不会执行,思考半天,用 ...
JS——返回上一页页面不刷新
function goback() {if (document.referrer) {window.location.href = document.referrer;} else {window.l ...
html5返回上一页不刷新,javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题...
我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览 ...
html页面中使用 JS 返回上一页及返回上一页并刷新，iframe中打开指定页面，跳转到指定页面
html页面中使用 JS 返回上一页及返回上一页并刷新,iframe中打开指定页面,跳转到指定页面. 常用方法: window.history.go(-1); //返回上一页 window.histo ...
JavaScript返回上一页后并刷新页面
一.返回上一页并刷新页面: window.location.replace(document.referrer); document.referrer:可以引用到上一个页面,这个属性是由浏览器支持的. ...
js返回上一页和刷新页面
返回上一页 window.history.go(-1);//返回上一页不刷新 window.history.back(); //返回上一页只是单纯的返回到上一页 window.location.hr ...
页面返回上一页下一页
<a href="Javascript:history.go(-1)">返回上一页</a> <a href="Javascript:hist ...

微信中苹果h5页面用window.history.go(-1)返回上一页页面不会重新加载/刷新

微信中苹果h5页面用window.history.go(-1)返回上一页页面不会重新加载/刷新相关推荐

最新文章

热门文章