Question

我对localStorage有问题，即使关闭了一个部分但又想保留另一个部分，它也会记住所有保存。示例：页面上有两个横幅。如果一个人单击以关闭横幅，它将关闭该横幅，但也会记住另一个横幅也已关闭。

代码：

<section class="alert-notice-contain status-alerts">

<div id ="1561524897" class="type-notice relative">
    <div class="close-notice-alert"></div>
    <div class="status-contain">
        <div class="status-msg">
            <p>This is a test. This is a long test.</p>
        </div>
    </div>
</div>

<div id ="1561524873" class="type-notice relative">
    <div class="close-notice-alert"></div>
    <div class="status-contain">
        <div class="status-msg">
            <p>This is notice 1</p>
        </div>
    </div>
</div>

<script> // JS code (inline to get the dynamic #ID
( function( $ ) {
        'use strict';
        $( document ).on( 'ready', function() {
            // Status
if(localStorage.getItem('isHide'))
$('#1561524897').hide();
$('#1561524897 .close-notice-alert').click(function(){
$('#1561524897').hide();localStorage.setItem('isHide',true);
});
} );
} ( jQuery ) );
</script>

<script>
    ( function( $ ) {
        'use strict';
        $( document ).on( 'ready', function() {
            // Status
if(localStorage.getItem('isHide'))
$('#1561524873').hide();
$('#1561524873 .close-notice-alert').click(function(){
$('#1561524873').hide(); localStorage.setItem('isHide',true);});
} );
} ( jQuery ) );
</script>

</section>

Answer 1

您应该使用id进行存储，而不是简单地将相同的变量“ isHide”设置为true。例如，设置为存储：localStorage.setItem('isHide-1561524897', true); 并阅读：localStorage.getItem('isHide-1561524897');

Answer 2

使用对象存储在本地存储中。 JSON.stringify（）将您的对象转换为字符串形式，而JSON.parse（）将您的对象转换为字符串形式。例如。

obj = { visibility : 'hidden' }

// set the localstorage
localstorage.setItem('isHide', JSON.stringify(obj));

// get the localstorage
let storageValue = JSON.parse(localstorage.getItem('isHide'));
// use storageValue accordingly

如何在每个项目上而不是对所有项目使用localStorage保存

2 个答案: