SessionStorage保存DIV显示？答案

【问题标题】：SessionStorage to save DIV display?SessionStorage保存DIV显示？
【发布时间】：2016-03-01 04:36:44
【问题描述】：

我可以使用会话存储设置我的 div 的显示样式吗？我有一个按钮，当单击该按钮时，它将显示另一个通常隐藏的 div。我想让它设置它是否被点击然后记住页面刷新后的状态？

这是我的代码：

<button id="ShopParts">Shop Parts</button>

$("#ShopParts").click(function() {
  $("#shop_vehicle_container").css("display", "block");
});

【问题讨论】：

所以你希望 $("#shop_vehicle_container") 的显示 css 在页面刷新后应该保持与之前相同。我说的对吗？

标签： javascript jquery session-storage

【解决方案1】：

是的。

var el = $('#shop_vehicle_container');
var style = el.css('display');

// Store
localStorage.setItem("savedstyle", style);
// Retrieve & set
el.css('display', localStorage.getItem("savedstyle"));

记得检查存储浏览器支持。

【讨论】：

【解决方案2】：

$(document).ready(function () {
    if (sessionStorage.getItem("shop-vehicle"))
    {
        $("#shop_vehicle_container").css("display", sessionStorage.getItem("shop-vehicle"));
    }
});
$("#ShopParts").click(function () {
    $("#shop_vehicle_container").css("display", "block");
    sessionStorage.setItem("shop-vehicle", $("#shop_vehicle_container").css("display"));
});

【讨论】：

非常感谢！这正是我想要做的。

【解决方案3】：

cookies 也有用..

function setCookie(name, value) {
    var cookie = name + "=" + escape(value) + ";";
    document.cookie = cookie;
}

function getCookie(name) {
  var regexp = new RegExp("(?:^" + name + "|;\s*"+ name + ")=(.*?)(?:;|$)", "g");
  var result = regexp.exec(document.cookie);
  return (result === null) ? null : result[1];
}

【讨论】：