Question

我有一个汽车列表和一个包含汽车品牌和“全部”的选择列表，在选择一个选项时我会根据他们的品牌过滤汽车。例如，当我选择“梅赛德斯”时，只显示梅赛德斯的汽车，我们选择全部，所有车辆都会显示出来。（一切正常）。

当我刷新页面时，我希望根据我选择的最后一个选项（刷新前）过滤列表，而不是再次列出所有列表。我想知道是否有办法在客户端执行此操作而无需服务器端工作。我只需要提一下，我的问题不是关于“onchange”功能，而是关于存储最后选择的选项。

Answer 1

如果您只需要它来保持页面刷新，而不是不同的浏览器会话，那么请使用sessionStorage api：

// When changing the filter
var filter = 'Mercedes';
sessionStorage.setItem('last-filter', filter);

// When loading the page (document.ready)
var filter = sessionStorage.getItem('last-filter') || 'all';
if (filter !== 'all') {
    changeFilter(filter);  // your function
}

只能直接存储字符串。而不是存储元素，而是存储其元素id / class。要存储其他对象，请使用数据上的JSON.stringify函数将其序列化为字符串。

如果您决定希望过滤器在浏览器崩溃时保持不变，则可以轻松切换完全兼容的localStorage api。 localstorage中的项目没有特定的到期日期，因此如果需要到期，那么您还需要保存过滤日期以自行检测和删除陈旧项目。

刷新JQuery后，将最后选择的选项保留在选择中

1 个答案: