AJAX 搜索返回按钮答案

【问题标题】：AJAX Search Back ButtonAJAX 搜索返回按钮
【发布时间】：2012-08-22 22:32:31
【问题描述】：

我正在尝试通过我构建的 AJAX 搜索来解决后退按钮的使用问题，但遇到了一些麻烦。我按照this previous question 的指示使用localStorage 和以下代码：

// Replace the search result table on load.
if (('localStorage' in window) && window['localStorage'] !== null) {
    if ('myTable' in localStorage && window.location.hash) {
        $("#myTable").html(localStorage.getItem('myTable'));
    }
}

// Save the search result table when leaving the page.
$(window).unload(function () {
    if (('localStorage' in window) && window['localStorage'] !== null) {
        var form = $("#myTable").html();
        localStorage.setItem('myTable', form);
    }
});

我无法弄清楚如何正确清除localStorage。使用上面的代码，用户可以执行搜索、单击链接、单击返回，他们的结果将被重新填充。但是，如果他们离开站点并稍后返回或刷新搜索页面，他们的结果仍然存在。我该如何解决这个问题？谢谢！

【问题讨论】：

标签： jquery ajax

【解决方案1】：

这样的？

localStorage.clear(); // <-- clears all local storage for domain

或单个项目

localStorage.removeItem('myTable');

如果您不喜欢 localStorage 在客户端手动删除之前一直存在的方式，还有 sessionStorage https://developer.mozilla.org/en-US/docs/DOM/Storage

会话存储

这是一个全局对象 (sessionStorage)，它维护一个在页面会话期间可用的存储区域。只要浏览器打开并在页面重新加载和恢复后仍然存在，页面会话就会持续。在新选项卡或窗口中打开页面将导致启动新会话。

// 将数据保存到当前会话的存储中

sessionStorage.setItem("username", "John");

// 访问一些存储的数据

alert( "username = " + sessionStorage.getItem("username"));

sessionStorage 对象对于挂起在浏览器意外刷新时应保存和恢复的临时数据最有用。

【讨论】：