解决微信内置浏览器返回上一页停留位置强制刷新问题的最简单方法(适用于本页无ajax请求) ...

转载于 2016-10-20 22:44:29 发布 · 837 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://segmentfault.com/a/1190000007224766

文章标签：

#javascript #ViewUI

本文介绍了一种使用sessionStorage或Cookies在页面跳转前后保存和恢复滚动位置的方法，适用于微信环境。通过简单的JavaScript代码实现，确保了用户体验的一致性。

在跳转链接前记录当前滚动条距离st 存入sessionStorage
跳转后返回读取st 重新赋值

    // 在微信内执行
    platform.isWeixin && this.getSt();
},
methods: {
    getSt() {
        if (window.sessionStorage) {
            if (sessionStorage.getItem("st")) {
                document.body.scrollTop = sessionStorage.getItem("st");
            }
        } else {
            if (Cookies.get("st")) {
                document.body.scrollTop = Cookies.get("st");
            }
        }
    },
    setSt() {
        if (window.sessionStorage) {
            sessionStorage.setItem('st', document.body.scrollTop);
        } else {
            Cookies.set('st', document.body.scrollTop)
        }
    },

因为sessionStorage兼容性问题
用了好用的cookie库 https://github.com/ScottHampe...

解决微信内置浏览器 返回上一页停留位置 强制刷新问题 的最简单方法(适用于本页无ajax请求) ...

解决微信内置浏览器返回上一页停留位置强制刷新问题的最简单方法(适用于本页无ajax请求) ...