window.history.pushState页面不更新

Question

我正在使用window.history.pushState()更改页面的url并将其放入历史记录列表中，一切都正常，但我有一个问题，例如在页面中，如果我执行了一个操作(ajax)，它会更改值​​在数据库中，以文本方式更新页面的一部分，如果我浏览其他地方并返回此页面，我会发现原来的内容，而不是所做的更改，为了正确查看它们，我必须刷新页面。

我目前不使用任何缓存系统一些内容是用ajax加载的，另一些则直接在页面上

window.history.pushState()只在其他应用程序的主页中使用，即使它发生在所有上，我也不需要它

在示例页面中，我有这个代码

function init() {
$('#weekDays').on('show.bs.modal', function(event) {
var modal = $(this);
$.ajax({
type: 'post',
cache: false,
url: '/my_account/get_giorni_chiusura_sett',
dataType: 'html'
}).done(function(data) {
modal.find('.modal-content').html(data);
});
});
$('body').on('click', '#save-closing-days', function() {
var dataString = $('#form-weekdays-close').serialize();
$.ajax({
type: 'post',
cache: false,
url: '/my_account/set_giorni_chiusura_sett',
data: dataString,
dataType: 'json'
}).done(function(data) {
if (data.update === 'ok') {
var daysClose = $.map(data.giorni, function(v) {
return '<strong>' + v + '</strong>';
}).join(' - ');
$('#list-days-close').html(daysClose);
$('#weekDays').modal('hide');
}
});
});
}

当我到达页面时，内容在没有ajax的情况下加载，并由php生成，第一个函数在打开时以模态加载内容，第二个函数保存/更新数据库上的数据并更新DOM 上的文本

收盘日：周六-周日

更新并成为

收盘日：周日

现在我从菜单移到其他页面，然后再移回来，但我又找到了：周六-周日

如果我重新加载页面，数据将更新

Answer 1

History API不会为您维护DOM的状态。你需要自己去做。MDN有一个很好的指南，但简短的版本是：

当用户单击链接时，您的JS应阻止默认行为并调用pushState以更改URL

，当用户按下浏览器中的后退按钮，并且

popstate事件触发时，您的JS应读取事件中的URL(以及状态数据(如果适用))，并使用DOM方法更新页面，以匹配服务器为该URL发送的内容(即取消上一段中的更改)。