Javascript 当用户离开页面时，如何保存无限多的AJAX内容？

我正在制作一个无限滚动的网站。也就是说，当用户滚动到页面底部时，一个新的内容块会附加到页面底部。它与Facebook非常相似。以下是加载的3个页面的示例：

 _________
|         |
|    0    |
|_________|
|         |
|    1    |
|_________|
|         |
|    2    |
|_________|

当用户单击最后一页上的某个内容时，我会将其转到单独的详细信息页。但是，如果用户单击返回搜索结果页面，则我对他们以前的位置没有记忆，必须再次加载页面0

 _________
|         |
|    0    |
|_________|

我知道一些老派的方法可以解决这个问题，但它们都有一些严重的问题：

散列URL 我可以在每次加载新页面时更新URL。例如：www.website.com/page#2。当用户转到详细信息页面并返回时，URL告诉我上次加载的页面，因此我为他加载该页面：

 _________
|         |
|    2    |
|_________|

但这是糟糕的用户体验。仅加载第2页。用户无法向上滚动查看旧内容。我不能只加载页面0、1和2，因为这会使服务器过载，因为后退按钮占了50%的web流量（Jacob Nielsen研究）

本地存储

---

Cookie没有存储多页数据的存储容量。应该有足够的空间。一个想法是将所有加载的页面存储到本地存储器中。当用户返回搜索结果时，我从本地存储加载，而不是点击服务器。这种方法的问题是，我的大部分用户都在不支持的浏览器上（IE7）

考虑到问题的局限性，我能想到的唯一可行的解决方案是缓存前面页面的高度，然后在用户向上滚动时加载它们。这将增加你的向上滚动，并允许你在用户查找时触发加载。此外，如果你想更有趣一点，我会设法找到一种冻结滚动条的方法，以防止用户滚动到上一个卸载的页面。这样一来，他们就不能一次触发多个页面加载。

与其让用户完全进入一个单独的详细页面，不如干脆隐藏主滚动内容，通过Ajax/

XMLHttpRequest（）

加载详细内容，然后让该内容可见？换句话说，就像Facebook是如何做到这一点的。我想你能否做到这一点取决于内容是什么，是你正在设计和控制的东西，还是外部的东西

为什么在一次请求1个页面时，一次加载所有显示的页面会使服务器过载？…内存无限。@Tejs:我的想法措辞不正确。我的意思是，一次加载100个页面对用户来说很慢，而且会给服务器带来不必要的负担。您甚至可以通过使用

历史记录来更改url和处理后退按钮。pushState

和

窗口。onpopstate

：-）@Rocket:这很有趣，我对此一无所知。这是我自己的一个项目，完全使用Ajax在一个页面内操纵大量内容，将真正受益的东西。非常感谢分享。详细信息页面超出我的控制范围。我必须进入一个新的物理页面。