解决苹果手机返回不刷新问题

本文探讨了JavaScript中使用history对象返回上一页时遇到的问题,特别是在iOS设备上的不刷新现象,并提供了四种解决方案,包括使用SPA、监听pageshow和pagehide事件等。

问题描述:

   js返回上一页的实现  :  1)   history.go(-1);

                                       2)   history.back();

                                       3)   history.back(-1);

  第一种方法在苹果手机上返回上一页并不刷新,导致在上一个页面中的状态未更新,第二三中方法没实验,估计也会有这个问题,在安卓手机上功能正常。

解决办法:

   比如现在有 a.html 和 b.html ,从 a.html 跳到 b.html 进行操作,b.html 中的操作更改状态传到后端保存,返回到a.html时重新请求下数据就可以将对应的状态更新过来。

   1、在 a.html 中的ajax请求url中添加随机数

         这个方法在微信端ios 系统9之前的版本可以,但是在app中无效。

   2、spa(单页路由)

         这个方法可以完美解决该问题。

   3、window.location.href = './a.html'

        该方法能解决这个问题,但是会带来一个新问题:返回进入死循环

   4、监听 pageshowpagehide 方法

         感觉这个是最好的办法了,对页面的改动不太大,只需在js中添加如下代码即可

           $(function () {
               var isPageHide = false;
                window.addEventListener('pageshow', function () {
                     if (isPageHide) {
                          window.location.reload();
                      }
               });
               window.addEventListener('pagehide', function () {
                     isPageHide = true;
               });
          });


       

         

 

   

转载于:https://www.cnblogs.com/angleStudy/p/8797526.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值