查看了很多解决ios微信返回不刷新页面的文章,大部分都是利用H5的新特性history来进行解决的,而且很多人的想法都是用了pushstate和popstate来实现了这个功能,但是用pushstate之后会添加一个history实体,然后在监听到时间触发popstate的时候,刷新页面的时候其实刷新的是刚才添加的这个实体,这样会陷入无限循环中,用户将退不出这个页面或者直接关闭这个页面。下面的这种方法很好的解决了这个问题。

$(function() {
pushHistory();
});
function pushHistory() {
window.addEventListener("popstate", function(e) {
     //这里监听到了后退事件
self.location.reload();
}, false);
var state = {
title : "",
url : "#"
};
window.history.replaceState(state, "", "#");
};

Tips:

1.popState事件只有在作用go(-1),back(),forward()等操作时才会触发。

2.重点是self.location.reload();,后退后刷新当前页面。其它人写的文章里缺少这一块,弄的我很是郁闷。

3.微信里在监听到iphone后退事件后会触发popState事件,在PopState事件里执行:self.location.reload();即可刷新后退后的页面。

4.pustate增加了history的长度,在后退的时候会出错,往往跳不出循环,而replace很好的解决了这个问题。

iphone微信后退不刷新的问题的更多相关文章

  1. [转] 2017-11-20 发布 另辟蹊径:vue单页面,多路由,前进刷新,后退不刷新

    目的:vue-cli构建的vue单页面应用,某些特定的页面,实现前进刷新,后退不刷新,类似app般的用户体验.注: 此处的刷新特指当进入此页面时,触发ajax请求,向服务器获取数据.不刷新特指当进入此 ...

  2. 另辟蹊径:vue单页面,多路由,前进刷新,后退不刷新

    目的:vue-cli构建的vue单页面应用,某些特定的页面,实现前进刷新,后退不刷新,类似app般的用户体验.注: 此处的刷新特指当进入此页面时,触发ajax请求,向服务器获取数据.不刷新特指当进入此 ...

  3. iPhone 微信平台链接到微信文章 返回上一页问题

    东钿金融服务平台 有个隐藏按钮,点击此按钮,会弹出一个九宫格的功能栏,其中有个‘工作时间‘,这项,它是链接到微信公众号里面的一篇文章,按照平常写法就是 直接把文章链接地址 赋在a的href上,但是iP ...

  4. 使用jquery的load方法设计动态加载,并解决浏览器前进、后退、刷新等问题

    继上一篇 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题 解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后 ...

  5. 微信浏览器返回刷新,监听微信浏览器返回事件,网页防复制,移动端禁止图片长按和vivo手机点击img标签放大图片

    以下代码都经过iphone7,华为MT7 ,谷歌浏览器,微信开发者工具,PC端微信验证.如有bug,还请在评论区留言. demo链接:https://pan.baidu.com/s/1c35mbjM ...

  6. 玩转vue前进刷新,后退不刷新and按需刷新

    大白萝卜小课堂开讲了!带你玩转vue前进后退按需刷新! 用vue做后台管理项目,特别是有列表页.列表数据详情页.列表数据修改页功能的码友们,几乎都被vue前进后退都刷新的逻辑坑过,本萝卜更是! 萝卜的 ...

  7. vue单页应用前进刷新后退不刷新方案探讨

    引言 前端webapp应用为了追求类似于native模式的细致体验,总是在不断的在向native的体验靠拢:比如本文即将要说到的功能,native由于是多页应用,新页面可以启用一个的新的webview ...

  8. iphone微信 h5页音乐自动播放

    iphone微信 h5页音乐自动播放: // iphone自动播放 document.addEventListener("WeixinJSBridgeReady", functio ...

  9. Python3 Selenium WebDriver网页的前进、后退、刷新、最大化、获取窗口位置、设置窗口大小、获取页面title、获取网页源码、获取Url等基本操作

    Python3 Selenium WebDriver网页的前进.后退.刷新.最大化.获取窗口位置.设置窗口大小.获取页面title.获取网页源码.获取Url等基本操作 通过selenium webdr ...

随机推荐

  1. OSX: Scripts,让BootCamp在不论什么Mac上支持生成Windows7的USB安装盘

    为什么要做这个呢,由于BootCamp仅仅有在默认的Mac上才会有生成USB安装盘的选项.这个脚本就是为了确保用户使用它在不论什么一个Mac机器上都能够生成Windows的USB安装盘.当然了,假设你 ...

  2. web常见效果之轮播图

    轮播图的展示效果是显而易见: HTML代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

  3. JavaScript 定义类的最佳写法——完整支持面向对象(封装、继承、多态),兼容所有浏览器,支持用JSDuck生成文档

    作者: zyl910 [TOC] 一.缘由 由于在ES6之前,JavaScript中没有定义类(class)语法.导致大家用各种五花八门的办法来定义类,代码风格不统一.而且对于模拟面向对象的三大支柱& ...

  4. 自学Zabbix3.5.1-监控项item-key详解

    自学Zabbix3.5.1-监控项item-key详解个人觉得艰难理解,故附上原文档:https://www.zabbix.com/documentation/3.0/manual/config/it ...

  5. immutable.js 更新数组(mergeDeepWith)

    使用情境: 技术栈为:react + redux + antd (reducer中处理数据使用了immutable.js). 问题:如下图,做一个搜索功能,form表单每改变一次,都会调用一个upda ...

  6. 「mysql优化专题」什么是慢查询?如何通过慢查询日志优化?(10)

    日志就跟人们写的日记一样,记录着过往的事情.但是人的日记是主观的(记自己想记的内容),而数据库的日志是客观的,根据记录内容分为以下好几种日志(技术文): a.错误日志:记录启动.运行或停止mysqld ...

  7. intellij idea 在什么地方打开终端Terminal

    File→Plugins→Terminal 勾选它,点击Apply,点击Restart即可如果是要启动terminal则必须先做完上面动作,才可以点击Tools→Open Terminal... 来达 ...

  8. JAVA IO分析三:IO总结&文件分割与合并实例

    时间飞逝,马上就要到2018年了,今天我们将要学习的是IO流学习的最后一节,即总结回顾前面所学,并学习一个案例用于前面所学的实际操作,下面我们就开始本节的学习: 一.原理与概念 一.概念流:流动 .流 ...

  9. Ignite与Spark集成时,ClassNotFoundException问题解决

    参考文章:https://apacheignite-fs.readme.io/docs/installation-deployment Spark application deployment mod ...

  10. 中文颜色名称与RGB颜色对照表

    中文颜色名称颜色对照表 鸨色 #f7acbc 赤白橡 #deab8a 油色 #817936 绀桔梗 #444693 踯躅色 #ef5b9c 肌色 #fedcbd 伽罗色 #7f7522 花色 #2b4 ...