我正在使用 JS、JQuery 和 PHP,试图解决无限滚动问题。问题是,如果您在页面向下滚动很长一段距离并使用 ajax 加载更多页面,然后单击链接转到新页面,使用浏览器时如何自动转到旧页面中的同一位置新页面上的后退按钮?
. 使用 ajax 在滚动时加载新页面。
我正在使用 JS、JQuery 和 PHP,试图解决无限滚动问题。问题是,如果您在页面向下滚动很长一段距离并使用 ajax 加载更多页面,然后单击链接转到新页面,使用浏览器时如何自动转到旧页面中的同一位置新页面上的后退按钮?
. 使用 ajax 在滚动时加载新页面。
我对我的问题提出的解决方案是在离开页面之前将每个页面与相关数据一起存储。
保持滚动位置需要以下信息:
加载下一页时,可以使用本地存储存储以前的信息。返回上一页时,在 storage 中查找 PageID。如果存在,则抓取 X 或 Y 坐标并将页面移动到该位置。这需要一些战略思考,因为如果页面是延迟加载(无限滚动)类型的页面或提要,您需要已经拥有数据或准备好根据页面的位置查找数据。
构建这个系统最简单的方法是,如果您的整个站点都是基于 javascript 的并且您使用的是 HTML 5 History Api。防止整页重新加载有助于减轻服务器的一些负担。如果您担心某些过期数据的更新,您可以将页码发送到服务器并获取相应的数据以填写过期内容。
你可以得到 $(window).scrollTop(); 值,然后将其保存为 php 中名为“pageTop”的变量,并在 DOM 就绪时调用它:
$(window).load(function() {
$(window).scrollTo(pageTop);
});
让我知道情况如何。