关于点击浏览器返回键,页面不刷新的问题

在项目中碰到的一个问题,当我点击手机上的返回按钮时,ios上正常刷新了前一个页面,并触发了我想要执行的函数,但是在华为荣耀手机上并没有刷新。

原因: 华为荣耀手机一定是读取了页面的缓存数据(今天搞清楚了是怎么回事),导致没有刷新页面
// 新更新的内容(详见高级程序设计-13.4.7节,HTML5事件中的pageshow事件
什么叫页面的缓存数据,原来又一个叫做bfcache的东西,这个是firfox提出的叫做"往返缓存"的一种缓存机制,用来加快用户在点击浏览器前进或者后退按钮时的速度。

这个时候,我就需要强制刷新页面了,怎么办呢。使用reload事件也没有用。

使用onpageshow事件

该事件一定要绑定在window对象上,代表用户浏览页面的时候就会触发这个事件。回调函数里面的event参数,会有一个persisted参数,利用这个参数来判断,是否需要刷新页面。如果为true,说明是从浏览器缓存中读取的数据(也就是从bfcache中拿的数据),就采取刷新页面的动作(window.location.reload())。如果为false,说明没有将页面的状态存在bfcache中。
推荐博客:https://www.cnblogs.com/wangmaoling/p/8022561.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 8,866评论 1 11
  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 14,480评论 2 59
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,078评论 1 45
  • 测试富文本编辑器,测试 测试富文本编辑器 体验如何
    韩子迟阅读 1,410评论 0 0
  • 早上电话老爸询问感冒发烧情况,谁知道他已经去医院看病去了,到单位晃了一下就急急忙忙的去了医院,老爸已经在等...
    紫玉_b836阅读 838评论 4 1