Question

当用户滚动到页面底部时，我正在使用Jquery Ajax将更多内容加载到我的页面，如下所示：

$(window).scroll(function(){
   if($(window).scrollTop() == $(document).height() - $(window).height()){
      $.ajax({
        url: /* my url goes here */,
        cache: true,
        success: function(html){ /*append html to the bottom of page*/ }
      });
    }
});

问题在于：当用户按下我页面中的某个链接然后按后退按钮时，之前加载的新内容会消失。如何保留新内容？提前谢谢。

Answer 1

单击后退按钮时，页面将返回到存储在浏览器历史记录中的原始状态。 Ajax倾向于“打破”后退按钮。

您可以在会话中保存一些标记，以说明您在最后一个视图中通过ajax加载的内容。当页面重新加载时，您可以检查服务器上一页的状态。

或者，在使用：window.location.hash( "new-url-hash" )进行ajax调用时更改片段标识符。您仍然需要使用您的javascript进行初步检查，以查看该网址的ID部分是什么。如果您更改location属性的任何其他部分，页面将重新加载。

HTML5添加了pushState()方法来更改浏览器历史记录。请参阅mozilla docs here。 pushState()不会导致页面重新加载。

ajax加载后缓存页面

1 个答案: