IOS微信浏览器返回事件popstate监听会立即执行一次【解决方案】

最新推荐文章于 2024-06-12 11:11:57 发布

原创最新推荐文章于 2024-06-12 11:11:57 发布 · 1.3k 阅读

3 ·

CC 4.0 BY-SA版权

【小程序与公众号】同时被 2 个专栏收录

16 篇文章

订阅专栏

【Android移动端IOS】

10 篇文章

订阅专栏

本文介绍如何在IOS版微信中解决由于popstate事件触发过快导致的从C页面直接跳转回A页面的问题，通过监听pageshow事件设置延迟，确保返回操作按预期流程进行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

页面跳转从a->b->b1->c，然后从c返回到b再到a。（监听popstate）
IOS版的微信，是会立即触法popstate事件，导致直接从C页面跳转到A页面

解决办法：

var bool = false;
window.addEventListener('pageshow',function(){
    bool = false;
    setTimeout(function(){
        bool = true;
    },1000)//延迟1秒 防止ios微信返回立即执行popstate事件
    pushHistory();
})
window.addEventListener(
"popstate",
function(e) {
    if (bool) {
        location.href ='页面b的地址';        
    }
    pushHistory();
},
false
);
function pushHistory() {
	var state = {
	    title: "title",
	    url: window.location.pathname + window.location.search
	};
	window.history.pushState(state, state.title, state.url);
}

原理：

因为在 IOS微信浏览器 里，返回上一个页面时，必定会触法 popstate 事件，就会导致立即执行返回到a页面。通过 pageshow事件 先延迟1秒的事件，让执行 popstate 事件时无法返回，等定时器把 isRun 的值改成 true ，然后再点击返回按钮，就会再次执行 popstate事件，就可以返回到你想要的页面。