有没有可能写一个“；“无限卷轴”；可以处理后退按钮的javascript？

到这里： 玩无限卷轴。请注意，您不能单击链接然后单击“后退”。当你这样做的时候，它会有小故障

所以，我打算写我自己的无限卷轴

• 当用户到达底部时，加载一个AJAX调用。然后执行JQuery将结果“附加”到div。然后，对这些元素调用我的其他函数。（我在javascript中设置了所有这些元素的背景图像）

---

这样行吗？如果我这样做……我能处理后退按钮吗？

处理后退按钮的唯一方法是改变位置散列（符号后的位）。处理按下后退和前进按钮可以通过两种方式完成：

添加一个对每个节唯一的

，并更改location.hash以匹配它

使用

setInterval

以100ms的短时间观察location.hash以查看更改并转到页面的所需部分。您必须这样做，因为您实际上无法检测单击后退/前进按钮的时间

这是第二个方法的实现，向您展示了它是如何工作的。在这种情况下，每个ajax请求都包含

和

ajax-section-2

等

function addToBottom(htmlToAdd) {
    $('#main-div').append(htmlToAdd);
    window.location.hash = $('#main-div a[name^=ajax-section-]').last().attr('name');
}

---

我在一个项目上也考虑过同样的事情。我考虑的一个选项是允许后退按钮返回到单击链接的位置（就像正常浏览一样）

首先，您需要记录无限滚动页面的内容，以便再次加载到该部分。您可以通过巧妙地使用

window.location.hash

值来实现这一点。如果您看一下，我将更详细地解释如何在纯JavaScript或jQuery中使用

它的基本部分是这样的：

// Whatever you're using to load the next page
function scrollToNextPage(page){
   // Your infinite scrolling stuff
   $.address.parameter("currentPage", page);
}

$.address.externalChange(function(){
   var page = $.address.parameter("currentPage"),
       top = $.address.parameter("linkTop");

   loadAjaxUpTo(page);   
   $('html, body').animate({ scrollTop: top }, 500);
});

// Set a parameter for the location of a clicked link
$("a").live('click', function(){
   $.address.parameter("linkTop", $(this).scrollTop());
});

我没有实现最后一点（点击链接的位置），但我不明白为什么它不起作用。它会使窗口很好地滚动到您所处的位置。您可以使用锚定将其设置为加载的页面（但当您滚动到它时，它将始终转到页面顶部）

不过有几点，我不建议这样做。至少对于我正在做的项目来说，这不是真的必要。在我的项目中，我们希望用户回去更改他们的选项，并认为滚动不会是一个问题（尽管我们没有那么多页面可以滚动）。AJAX（以及设置图像的JavaScript）需要重新加载和执行，这需要花费大量时间，具体取决于需要重新加载的页面数量。在滚动到链接的时间之外（你可以只滚动到

窗口。滚动到
但你没有动画，所以一切都很不稳定。你可以总是只加载此人所在的页面，忘记以前的页面，但你仍然以这种方式破坏用户体验。或者（我尝试过的）是实现双向无限滚动。因此，如果用户向上滚动，它将加载用户单击的页面，并在前面的页面前加上
prepend
——尽管如此，这项工作太多了

另一点是，如果您仍然这样做，您希望使用
GET
请求来获取页面（并确保缓存不会立即过期）。我发现Ajax使用GET请求请求的页面将从缓存中获取（至少在我尝试的一些浏览器上）。通过
帖子发送您的详细信息将始终忽略缓存。
Twitter不会再次重新加载页面。如果您转到Twitter.com/jack，请单击其他用户转到该页面。然后单击“上一步”，您将意识到Twitter不会“重新加载”额外的内容（firebug中的watch NET）.是的-没错。我不是说这是个好主意-在我的经验中，我发现这比它的价值更麻烦，实际上让用户体验更糟糕。只是我描述的技术是可能的：）@JonathonBoost那么你将如何实现loadAjaxUpTo（页面）？在您的示例中，它必须是$（window）.scrollTop（）。Twitter不会再次重新加载页面。如果您转到Twitter.com/jack，请单击其他用户转到该页面。然后点击“后退”，你会发现twitter不会“重新加载”额外的内容（firebug中的watch NET）。我不是建议重新加载页面。我是说他应该改变window.location.hash。再读一遍。我个人发现使用
localStorage
（）存储他们的最后一部分要比存储位置散列简单得多，也更可靠。但我认为这两种方法都有优点。