非 ios 下面的一般代码如下
pc 端或者 android webview没有问题, 但是 ios 有问题
history.pushState(null, null, document.URL);
window.onpopstate = function () {
window.location.href = './A.html';
}
需要做的就是将如下 listenerBackHandler 对应的代码copy 进返回的页面
代码展示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>B page</title>
</head>
<!-- <body onload="myonload()" onpageshow="mypageshowcode()"> -->
<body>
i am B page <br>
当前页面只能返回到 A page
<a href="./C.html">跳转到c 页面</a>
<br>
<ol>
<li>popstate 一般需要当前 document 中存在两个 url(pushstate)+ 通过 back or forward 来触发</li>
<li> chrome 中 只在当前页面back or forward 触发</li>
<li> 微信ios 中 进入和离开当前页面都会触发 popstate 事件, 如下案例中 一般会出现 返回的时候跳过 B page</li>
</ol>
<script>
var listenerBackHandler = { // 在返回首页的时候会有 1s 的bug
param: {
isRun: false, //防止微信返回立即执行popstate事件
},
listenerBack: function () {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
window.addEventListener("popstate", function (e) {
if (listenerBackHandler.param.isRun) {
window.location.href = "./A.html"; //返回到主页
}
}, false);
},
//初始化返回事件
initBack: function () {
window.addEventListener('pageshow', function () {
listenerBackHandler.param.isRun = false;
setTimeout(function () { listenerBackHandler.param.isRun = true; }, 1000); //延迟1秒 防止微信返回立即执行popstate事件
listenerBackHandler.listenerBack();
});
}
};
listenerBackHandler.initBack();
</script>
</body>
</html>
详细代码如下连接
链接:https://pan.baidu.com/s/1qdiUzivwPKPKo19gD1cmhA
提取码:qbec