Question

我有一个图像网格，当你点击一个div（也有一个id）时，它会得到类＆＃34;活动＆＃34;。然后我把那个让这个班级活跃的div的id's＆＃39;进入sessionStorage数组。

在下一页我想知道哪些id已存储在我的sessionStorage中，并希望显示特定的div。

例如，数组包含id＆＃39; banner＆＃39;，类标题可见。

到目前为止我的代码：

 var sections = $.map($(".active"), function(n, i){
    return n.id;
  });

  sessionStorage.setItem("sections", JSON.stringify(sections));

  var storedSections = JSON.parse(sessionStorage.getItem("sections"));

这是将id放入数组中。

我可以在我的.html文件中读出它们：

<script type="text/javascript">
    document.getElementById("test").innerHTML = sessionStorage.getItem('sections');
</script>

结果如下：

["header","banner","footer"]

但是如何显示某些div，具体取决于上面的结果？

Answer 1

您可以这样做，迭代从存储中收到的数组：

var divs = ["div_1", "div_3"];
divs.forEach( function (div){

  /* JavaScript approach */
  var elem = document.getElementById(div);
  elem.style.display = 'block';
  
  /* jQuery approach */
  $("#" + div).show();
});

div {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div_1">Hello 1</div>
<div id="div_2">Hello 2</div>
<div id="div_3">Hello 3</div>

Answer 2

update Yourtable set col = -1 where col <> 0;方法是转换一个字符串数组（id列表），然后在会话存储中设置它。如果要在这些div上设置活动类，可以使用以下数组：

Where col <> 0

Answer 3

var sections = sessionStorage.getItem('sections');
$(sections).each(function(value) {
     $("#" + sections[value]).show();
});

https://jsfiddle.net/Lbzbztwa/

如何在sessionStorage中基于数组显示div

3 个答案: