我已经看到类似的问题，如：Ajax, back button and DOM updates，事实上，我目前所做的尝试都是从这些问题的答案中得到启发的，但是，没有一个问题描述了我在实际应用他们的建议时所面临的问题
这就是现在正在发生的事情：
- 页面A执行一个ajax调用，我将使用它来更新DOM上的元素"例如，选择的数量"
- 用户转到页面B并执行相同操作
- 用户点击后退按钮
- 页面A加载，但是我对DOM所做的所有更改都丢失了
- 用户点击前进按钮
- 页面B显示，所有更改也将丢失
目前为止我尝试的是：- 在jQuery的ready方法中重新加载数量。这是可行的......尽管用户可以看到几秒钟的旧数量。但是，它有一个很大的缺点，因为它复制了发送到服务器的调用数量
- 在每次ajax调用后更新window.location.hash值。即
窗口.位置.哈希=新日期（）. getTime（）;
这也可以工作，但问题是我必须单击后退按钮两次，因为第一次单击会重新加载当前页面。
有什么办法解决这个问题吗？我最后想做的是保存DOM状态，以避免为了更新数量而额外调用服务器。
谢啦，谢啦
2条答案
按热度按时间k10s72fa1#
如果你真的在“改变页面”，是的，即使从缓存中工作，浏览器也会显示从服务器检索时的页面，而不是后来修改时的页面。
如果你想保持Page A / Page B的结构，而不是切换到更多的SPA方法，你可以将 AJAX 结果存储在
sessionStorage中，并在页面加载时检查它。如果没有，通过 AJAX 请求并应用（并保存），这比通过网络重新请求要快得多。xlpyo6sf2#
我建议你用popstate来解决这个问题。它看起来像这样，
此脚本将让页面刷新时，你点击后退或前进按钮。但数据必须重新加载。