关于操作浏览器历史记录所出现的问题,求解?

最近在开发时遇到个问题(微信公众号),有三个页面,分别为商品详情页,订单确认页(支付页面),支付成功页面,在订单确认页面监听,如下:

history.pushState(null, null, '#');
window.onpopstate = function (event) {
    if(orderId == '') {
        new TipAlert({content:"<div></div>"}).confirm('<h3 style="font-size:0.176rem;margin-top:0.088rem;margin-bottom:0.029rem;font-weight:bold;">确定要放弃付款吗?</h3><p style="font-size:0.129rem;">你的订单在30分钟内未支付将被取消</p><p style="font-size:0.129rem;">请尽快完成支付</p>',
            function (isTrue) {
                if (!isTrue) {
                    window.history.go(-1);
                } else {
                    history.pushState({page: 'state1'}, 'state', '#state1');
                }
            }, {close: "暂时离开", ok: "继续支付", CloseColor: "#666", OkColor: "#fff", OkBackgroundColor: "#d93e09"});
    }
}

现在的问题是在支付成功页面点击微信返回按钮时需要跳转到详情页面,同时需要点击此时的商品详情页的返回按钮时需要回到初始进入详情页的那个页面。这个需求该怎么实现呢?各位大神!
                
  
    
阅读 2.5k
1 个回答
  1. 进入支付页面的时候加多一个history,保证点击返回的还在这个页面上:history.pushState({},'title','#hash')

  2. 监听浏览器后退事件,这时候还在支付成功的界面,我们主动回退到详情页面

window.onpopstate = function(){
    // 算一下回退多少步才能会退到详情页面
    history.go(-3)
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题