html5手机返回按钮跳转到指定页面问题

时间:2022-02-12 23:06:08

最近在做活动的时候有一个这样的场景,在主页面点击跳出一个弹层表单,填写完信息后,点击确认跳转到指定的展示页面了。这时候在手机端点击浏览器自带的返回按钮后,回到主页面,这时候主页面无法刷新,弹层信息还在。所以采用了html5的一个方法让展示页面返回时跳转到指定页面

index.html是我的主页面,在该页面有个弹层表单;

show.html是我的展示页面,在该页面有返回按钮监听的方法

show.html页面添加下面脚本,监听跳转到首页地址:

window.onpopstate = function(event) {
location.href = "index.html";
};

添加并激活一个历史记录条目:

history.pushState({}, "title 1", "#");

经测试,在返回主页面的时候其实是重新加载了页面,正好达到我的目的,解决了返回时无法刷新页面的问题。

by as