Question

就像我在其他问题中提到的那样，我正在构建自己的Web应用程序。

现在我有了这个应用程序 - ＆gt;在这里Plunker！你可以在这里看得更清楚。我在标题中有一个标签，我可以浏览多个页面并加载其内容。

<!DOCTYPE html>
<html>
  <head>
   <link rel="stylesheet" href="style.css">
   <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
   <script src="script.js"></script>
  </head>
<body>
  <a href="link1">Link 1</a>
  <a href="link2">Link 2</a>
 <div id="content">
   <!-- Page content displays here --> 
 </div> 
</body>
</html>

$(document).ready(function(){ 
 $('a').click(function(e){
  var page = $(this).attr('href');   
  $('#content').load(page + '.html');   
  return false; // don't follow the link
 }); 
});

工作正常！但是我在保存页面状态方面遇到了问题。

例如，如果我在第2页并刷新浏览器，则页面将返回其开始状态。如何让我在刷新时保持当前页面。

我非常感谢每一个解决方案或提示！

Answer 1

您必须利用浏览器History API。在每个内容加载时，您必须将状态推送到历史记录。

在硬刷新时，您必须解析网址并获取正确的内容。

使用这种方法时要记住的一件事是，您必须跳过箍，以便搜索引擎抓取工具轻松索引您的所有＆＃34;页面＆＃34;。

另一种方法是使用Turbolinks。

干杯。

在页面刷新时保存html页面的状态

1 个答案: