页面刷新后保持数组中隐藏的div选择

时间:2012-10-25 19:34:15

标签: javascript jquery html refresh hidden

我创建了一个div id数组,这样页面的用户就可以在选择要显示的div之一或所有div之间进行切换。我的脚本如下所示:

<script type="text/javascript">
function switchdivs(theid){
var thearray= new Array("div1", "div2", "div3");
for(i=0; i<thearray.length; i++){
  if(thearray[i] == theid || theid == "all"){
        document.getElementById(thearray[i]).style.display="block";

  }else{
document.getElementById(thearray[i]).style.display="none";
  }
}
}
</script>

我希望在页面刷新后继续选择用户。我已经阅读了一些这方面的例子,例如Jquery show/hide resetting when page reloads这些有助于我的理解,但我仍然无法使用我的数组。我是否需要为每个ID设置规则,还是使用该阵列有更优雅的解决方案?我尝试过类似的东西,但是你可以从我糟糕的剧本中看出我对javascript很新,我很丢失:

$(document).ready(function() {

if (sessionStorage['divselection']) {
if (sessionStorage['divselection'] === 'theid')
    $("#theid").show();
else
    $("#thearray[i]").hide();
}  

$("input[name='theid']").change(function() {
if( $("input[name='thearray[i]']:checked").val() == "theid")
{
    $("#thearray[i]").hide();
    $("#theid").show();
    sessionStorage['divselection'] = 'theid';
}
});

感谢您帮助我指明正确的方向。

1 个答案:

答案 0 :(得分:0)

CSS类名称的重点在于您可以将它们应用于元素。因此,不要跟踪个人ID,而是使用类。

此外,不是隐藏和显示元素,而是再次使用类名,但将类名与实际样式相关联。如:

.hideMe {
    display:none
}

...然后你可以添加/删除所有隐藏/显示的类名。