在项目(单页面模式)中最近安卓设备出现了回退异常现象,以前回退正常。
复现方式(下方贴出验证demo):
1、依次点击改变hashA、B、C按钮,从hashC回退到B能正常回退,继续从B回退会被关闭页面,如果回退到hashB此时随意点击一下页面或者任意的人和手机的交互后再点回退,依然能正常回退到hashA。
2、如果注释掉history.pushState(null, null, document.URL);这一行代码能正常回退,也能监听到popstate
由于程序需要阻止回退采用的这种方案,最近才出现的问题,网上各种查有类似问题但是没有实际的解决方式,有不有什么解决办法或者平替方案吗?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>popstate验证</title>
<style>
</style>
<!-- <script src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> -->
</head>
<body>
<script src="./vconsole.min.js"></script>
<button onclick="changeHash()">改变hashA</button>
<button onclick="changeHashB()">改变hashB</button>
<button onclick="changeHashC()">改变hashC</button>
<script>
var vConsole = new window.VConsole();
</script>
<script>
function changeHash(){
location.hash = 'A';
}
function changeHashB(){
location.hash = 'B';
}
function changeHashC(){
location.hash = 'C';
}
window.addEventListener("popstate", function(e) {
history.pushState(null, null, document.URL);
}, false)
</script>
</body>
</html>
顶,ios新款手机、android现在都不能触发
各位大佬有解决办法吗