LocalStorage存储多个div隐藏

我正在使用一个简单的代码来隐藏多个div，如果点击链接来隐藏它们。其中之一，我有本地存储设置记住div是否隐藏。事情是这样的。我如何编写代码使本地存储器记住多个div的隐藏状态，而不必为每个单独的div放置localstorage.setItem。是否有可能存储一个数组与div ID和他们的显示设置为true或false来决定页面是否应该显示它们？LocalStorage存储多个div隐藏

** * ** * ****EDITED* ** * ** * ** * **

function ShowHide(id) { 
if(document.getElementById(id).style.display = '') { 
document.getElementById(id).style.display = 'none'; 
} 
else if (document.getElementById(id).style.display = 'none') { 
document.getElementById(id).style.display = ''; 
}

来源

2012-11-07 Jesse Toxik

存储JSON字符串 –

您可能想要使用对象而不是数组 – PitaJ

您是否有示例代码？ –

就像你说的，你已经h一个存储你所有状态的数组。您可以使用JSON.stringify()对此进行序列化，并将结果存入localStorage。

// your array 
var divstate = [ ... ]; 

// store it 
localStorage.setItem('divstate', JSON.stringify(divstate));

如果您想再次检索数组，使用JSON.parse()：

// restore 
var divstate = JSON.parse(localStorage.getItem('divstate');

编辑

来存储所有的div的实际IDS，你可能会使用这样的

var divstate = { 
    'divid1': true, 
    'divid2': false, 
    ... 
};

这很容易与上述模式一起使用。

第二编辑

对于上面的代码，我会建议使用上面的语句在页面加载一次加载状态变量。

然后变换函数是这样的：

function ShowHide(id) { 
    var el = document.getElementById(id); 

    if (divstate[id] === true) { 
    divstate[id] = false; 
    el.style.display = 'none'; 
    } else { 
    divstate[id] = true; 
    el.style.display = ''; 
    } 

    localStorage.setItem('divstate', JSON.stringify(divstate)); 
}

这样的divstate被更新，并保存在每个函数调用。

请注意，如果div的数量太高，我不会推荐这样做，但对于较小的数量，这应该足够了。

来源

2012-11-07 16:47:45 Sirko

@JesseToxik编辑回答你的问题了吗？ – Sirko

查看我对我的问题的编辑，看看我用来隐藏我的div的代码的草稿。如何将本地存储与代码一起实现？ –

@JesseToxik看到我的第二次编辑。 – Sirko

LocalStorage存储多个div隐藏

回答

相关问题