刷新页面滚定滚动条位置

最新推荐文章于 2023-08-23 12:00:47 发布

原创最新推荐文章于 2023-08-23 12:00:47 发布 · 442 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript和cookie来保存和恢复网页滚动位置的方法。通过监听onbeforeunload事件，获取当前页面的滚动位置，并将其存储在cookie中；加载页面时检查cookie是否存在滚动位置信息，如果存在则恢复该位置。

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

window.onbeforeunload = function() {
        var scrollPos;
        if (typeof window.pageYOffset != 'undefined') {
            scrollPos = window.pageYOffset;
        } else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
            scrollPos = document.documentElement.scrollTop;
        } else if (typeof document.body != 'undefined') {
            scrollPos = document.body.scrollTop;
        }
        document.cookie = "SZY_GOODS_SCROLLTOP=" + scrollPos; //存储滚动条位置到cookies中
    }
    if (document.cookie.match(/SZY_GOODS_SCROLLTOP=([^;]+)(;|$)/) != null) {
        //cookies中不为空，则读取滚动条位置
        var arr = document.cookie.match(/SZY_GOODS_SCROLLTOP=([^;]+)(;|$)/);
        document.documentElement.scrollTop = parseInt(arr[1]);
        document.body.scrollTop = parseInt(arr[1]);
    }