iOS微信浏览器回退不刷新实例(监听浏览器回退事件)

iOS在微信浏览器回退是不重新加载页面的，有些时候是需要重新加载的，所以需要监听回退事件

$(function(){
  pushHistory();
});
function pushHistory(){
  window.addEventListener("popstate", function(e){
    alert("回退！");

    //window.history.back();
    //在历史记录中后退,这就像用户点击浏览器的后退按钮一样。

    //window.history.go(-1);
    //你可以使用go()方法从当前会话的历史记录中加载页面（当前页面位置索引值为0，上一页就是-1，下一页为1）。

    //self.location=document.referrer;
    //可以获取前一页面的URL地址的方法,并返回上一页。
  }, false);
  var state = {
    title:"",
    url: "#"
  };
  window.history.pushState(state, "", "#");
};

新增一个历史记录点window.history.pushState，pushState有三个参数

1状态对象：记录历史记录点的额外对象，可以为空

2页面标题：目前所有浏览器都不支持

3可选的url：浏览器不会检查url是否存在，只改变url，url必须同域，不能跨域

监听历史记录点popstate事件，当浏览器操作历史记录条目时触发

以上这篇iOS微信浏览器回退不刷新实例(监听浏览器回退事件)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 微信浏览器弹出框滑动时页面跟着滑动的实现代码（兼容Android和IOS端）

    在做微信开发的时候遇到这个问题:微信浏览器弹出框滑动时页面跟着滑动. 我觉得这个问题用的是下面这几行代码: var $body = $('body'), dialogIsInView = !1,//当前是不是对话框 lastContentContainerScrollTop = -1,//用于弹出框禁止内容滚动 $contentContainer = $('#content-container');//内容容器 //阻止Window滚动 function stopWindowScroll() {

  • JS如何设置iOS中微信浏览器的title

    说到web前端,浏览器差异是不可回避的问题,这次在项目就遇到下面的问题: 微信导航栏的内容是直接拿的项目中title来设置的.但是现在做的项目是一个单页应用,整个页面只会在第一次完全刷新,后面只会局部刷新,所以只能在页面刷新的时候通过js动态修改title.开始我们使用的做法如下: document.title = "微信导航栏想要显示的内容"; $("title").text("微信导航栏想要显示的内容"); document.getEleme

  • ios微信浏览器返回不刷新问题完美解决方法

    开始用的表单提交,返回参数就丢失,换成url跳转,popstate监听 (注释部分)ios10测试始终有问题,继续搜,最后用pageshow,pagehide完美解决(另外说一句:珍爱生命,远离微信和ios) var wxback = { init :function(){ //隐藏微信分享按钮等 document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { WeixinJSBridge.call('hid

  • iOS微信浏览器回退不刷新实例(监听浏览器回退事件)

    iOS在微信浏览器回退是不重新加载页面的,有些时候是需要重新加载的,所以需要监听回退事件 $(function(){ pushHistory(); }); function pushHistory(){ window.addEventListener("popstate", function(e){ alert("回退!"); //window.history.back(); //在历史记录中后退,这就像用户点击浏览器的后退按钮一样. //window.histor

  • jQuery监听浏览器窗口大小的变化实例

    方法一:在标签上加入  onLoad="" onResize=""  方法  写上对应的方法即可 方法二:window.onresize=function(){///.....} 在方法里面写上对应的代码即可 着两种方法基本都可以解决问题. <script> function adjust(obj){ var div = document.getElementById("pad"); var txt = document.getEle

  • vue如何监听浏览器主动刷新

    目录 监听浏览器主动刷新 监听刷新事件如何写? 监听浏览器主动刷新 mounted() { window.addEventListener('beforeunload', e => this.beforeunloadHandler(e)) //监听页面刷新触发事件 }, methods(){ beforeunloadHandler(e) { //根据事件进行操作进行操作 console.log(e) console.log('浏览器刷新') }, }, destroyed () { //进行监听

  • vue监听浏览器原生返回按钮,进行路由转跳操作

    今天测试给我报了个bug说点击浏览器返回页数据显示的不对,我查了半天原因:需要监听浏览器的回退按钮,并阻止其默认事件. 具体操作方法如下: 1.挂载完成后,判断浏览器是否支持popstate mounted(){ if (window.history && window.history.pushState) { history.pushState(null, null, document.URL); window.addEventListener('popstate', this.canc

  • 详解React Native监听Android回退按键与程序化退出应用

    详解React Native监听Android回退按键与程序化退出应用 前言 我们知道Android回退按键,会控制页面返回, 并且退出应用并非真正意义退出,仍在后台运行,所以在某些场景下需要监控android回退按键,那么在React Native中应该如何应用呢?我们具体来看看. BackAndroid 此模块用于监听硬件的back键操作. 看下具体代码: BackAndroid.addEventListener('hardwareBackPress', function() { if (!

  • Python2.7:使用Pyhook模块监听鼠标键盘事件-获取坐标实例

    Python2.7: 使用Pyhook模块监听鼠标键盘事件-获取坐标.因该模块对Python3 有兼容性问题,故采用python2.7解释器. 原程序可监听所有事件,现注释掉部分功能,只输出鼠标左键触发的坐标,用于获取坐标,方便自动化取点. # -*- coding: utf-8 -*- # # import pythoncom import pyHook def onMouseEvent(event): # 监听鼠标事件 # print ("MessageName:", event.

  • 解决vue单页面多个组件嵌套监听浏览器窗口变化问题

    需求 最近公司有个大屏展示项目(如下图) 页面的元素需要做响应式监听,图表需要跟着窗口响应变化 问题 每一个图表都被我写成了一个组件,然后就在每一个组件里写了一串代码,监听浏览器变化 结果只有父组件的代码生效 mounted(){ window.onresize = () => { //当窗口发生改变时触发 // }; } 原因 经简单测试后发现,同一个路由页面只能注册一次浏览器窗口监听事件,第二次注册的会覆盖第一次注册 下边代码即可测试 mounted(){ window.onresize =

  • JavaFX 监听窗口关闭事件实例详解

    JavaFX 监听窗口关闭事件实例详解

    1.写在前面 在JavaFX的程序开发的时候,在使用多线程的时候,默认情况下在程序退出的时候,新开的线程依然在后台运行. 在这种情况下,可以监听窗口关闭事件,在里面关闭子线程. 2.具体实现的样例 package sample; import javafx.application.Application; import javafx.beans.value.ChangeListener; import javafx.beans.value.ObservableValue; import java

  • Flex 自动获取焦点 监听全局键盘事件

    这是<Flex第一步>QQ群里面一个朋友问我的问题,特此拿出分享一下.或许问题比较简单,还是将其记录一下比较好. 需求如下: 当AIR启动后,监听全局键盘事件,即this.addEventListener( KeyboardEvent.KEY_DOWN, keydownHandler ); 运行后效果: 当AIR运行后,虽然正确监听了KeyboardEvent.KEY_DOWN event,但是必须要鼠标点击一下AIR才可以获取keydownHandler. 原因: 1.keydownHand

  • android监听返回按钮事件的方法

    android监听返回按钮事件的方法

    本文实例讲述了android监听返回按钮事件的方法.分享给大家供大家参考.具体如下: 用户在点击手机的返回按钮时,默认是推出当前的activty,但是有时用户不小心按到返回,所以需要给用户一个提示,这就需要重写onkeydown事件,实现的效果如下: java代码如下: @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.l

随机推荐