如何在javascript中更改浏览器历史记录答案

【问题标题】：how to change browser history in java script如何在javascript中更改浏览器历史记录
【发布时间】：2017-07-09 14:33:22
【问题描述】：

我正在创建一个小型 Web 应用程序，并在 div 中使用 ajax 加载我的页面。

每当用户点击链接，ajax 请求页面，然后更新我的 div 和 url.. 当我尝试刷新我的页面时，在 ajax 请求之后，

它工作正常并向我显示当前页面，但是当我单击后退按钮时，它会更改顶部 url，但不会更改页面及其内容这是我的代码

$.ajax({ 
url: link, 
type:'POST', 
data : name, 
success: function(data) { 
$("#main").html(data);  
  history.pushState({foo:'bar'}, title, link);
  }
 }
});

【问题讨论】：

你需要处理popstate事件。
是的，我搜索了它，但我不明白，请告诉我它是如何工作的？谢谢
您正在寻找文档。

标签： javascript ajax

【解决方案1】：

正如@Slaks 在 cmets 中所说，您需要处理 window.onpopstate。

文档：

返回不会改变文档的内容在上一步中，尽管文档可能会更新其内容在接收到popstate 事件时手动进行。

为此，您需要一个State object，将其作为参数传递给您的pushState 调用。状态对象是与新历史条目相关联的 javascript 对象。 popstate 事件仅在活动历史记录条目更改时触发，并且它将具有State object 的副本作为参数。正如文档所说，history.pushState()（和history.replaceState()）方法仅添加（和修改）历史条目，原因如下：

调用 history.pushState() 或 history.replaceState() 不会触发 popstate 事件。 popstate 事件仅通过执行浏览器操作触发，例如在同一文档的两个历史条目之间导航时单击后退按钮（或在 JavaScript 中调用 history.back()）。

【讨论】：