修复滚动位置记忆脚本：适配URL重写后的多页面场景

嗨，我完全懂你的困扰！因为你用了URL重写，不同的页面（比如page1.php、带参数的page1.php?abc=1，还有page2.php）最终都指向同一个detail.php文件，而你原来的脚本只用了一个通用的scrollpos键来存滚动位置——这就导致不管你在哪个页面滚动，都会覆盖同一个存储值，切换页面时自然就加载了错误的滚动位置。

那我们只需要给每个**唯一的页面URL（包括查询参数）**生成独立的存储标识，就能解决这个问题啦。下面是修改后的脚本：

<script>
document.addEventListener("DOMContentLoaded", function (event) {
    // 生成当前页面唯一的存储键，用完整URL做区分
    const pageUniqueKey = `scrollpos_${window.location.href}`;
    const savedScrollPos = localStorage.getItem(pageUniqueKey);
    // 读取时把字符串转成数字，确保scrollTo能正确解析
    if (savedScrollPos) window.scrollTo(0, parseInt(savedScrollPos));
});

window.onscroll = function (e) {
    // 同样用当前页面的唯一键来存储滚动位置
    const pageUniqueKey = `scrollpos_${window.location.href}`;
    localStorage.setItem(pageUniqueKey, window.scrollY);
};
</script>

核心修改点说明： #

• 用完整URL做唯一标识：window.location.href会包含当前页面的完整路径和所有查询参数，能精准区分page1.php、page1.php?abc=1和page2.php这几种不同的场景
• 带前缀的存储键：用scrollpos_作为前缀，避免和localStorage里的其他自定义存储键冲突
• 类型转换：因为localStorage只能存储字符串，读取时用parseInt把存储的滚动位置转成数字，保证window.scrollTo能正常工作

如果你之后遇到某些参数不影响页面内容（比如统计用的跟踪参数），不需要区分滚动位置的情况，还可以调整键的生成逻辑——比如只取window.location.pathname + window.location.search的部分，或者手动过滤掉无关参数，灵活度很高。

备注：内容来源于stack exchange，提问作者Tomáš Rejka