后续补充： 页面css设置了height： 100%，来避免使用fixed定位弹窗引起的部分机型兼容问题，因此会在返回的时候回到页面顶部，补充解决办法： 在弹窗出现的时候在设置100%高度，并让文档滚动到之前滚动的位置，弹窗关闭的时候取消高度限制，body滚动还原
在近期做的一个移动端分享到微信的页面时，遇到了这样一个现象：
在A页面中部点击链接跳转到B页面后，按系统返回操作回到A页面时，
在安卓中刷新重载显示页面的顶部开始，
iOS中则直接返回上次浏览位置，保存了用户操作记录；
针对上述问题，在网上查找了相关解决办法，说的都比较概括，用了一天的时间才解决掉这个问题（蠢哭(╥╯^╰╥)），下面将我的方法贴出来，希望能给到像我之前一样走弯路的童鞋一些帮助吧，主要适用于单页面间的跳转。用到了sessionStorage 和 history的replaceState方法。具体代码如下：
html部分:
<a data-h5="1" href="https://segmentfault.com/"><span class="img"><img src="./images/vip/img-book2.png" alt="全球好书"></span<b>如何高效学习</b></a>
js部分:
$('a[data-h5="1"]').on('click', function () {
// 点击链接记录当前页面滚动位置
sessionStorage.setItem('scrollTop', $('.body').scrollTop());
});
// 判断当前页面是否返回还是直接跳转的，读取sessionStorage缓存显示页面
if (sessionStorage.getItem('scrollTop') != null && sessionStorage.getItem('loadType') == 'back') {
// 避免载入延时处理
setTimeout(function(){
// 执行缓存信息
$('.body').scrollTop(sessionStorage.getItem('scrollTop'));
// 清除上次缓存
sessionStorage.removeItem('scrollTop');
},200);
}
// 设置缓存页面加载来源信息，load：直接跳转，back:浏览器返回
sessionStorage.setItem('loadType', 'load');
// 设置浏览器history,用来监测页面返回
replaceHistory(window.location.href);
// 监测浏览器返回事件，设置返回页面缓存状态
window.addEventListener("popstate", function (e) {
// 设置sessionStorage中页面返回参数标记
sessionStorage.setItem('loadType', 'back');
}, false);
function replaceHistory(url) {
var state = {
title: "title",
url: url
};
window.history.replaceState(state, "title", url);
}
至此，微信浏览器按返回不能保存之前界面的浏览位置信息的问题就解决了，如果有更好的解决办法，欢迎大家一起交流讨论哈~~
一个小问题花费那么多的时间来解决真的很头疼，自身能力真的还差太多。。。修炼中。。。。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
