使用单独的显示和隐藏 div 按钮并在 Javascript 中使用 localStorage 保存状态？

编程问答 2022-05-30

问题描述

我目前正在使用以下代码在单击按钮时将 Div 切换为可见或隐藏，localStorage 用于在页面刷新时保持 div 的可见/隐藏状态。

我将如何做与此类似的事情，但它使用两个不同的按钮（一个仅在单击时显示 div，另一个按钮仅在单击时隐藏 div）而不是一个切换按钮?

HTML：

<button class="js-button button">Toggle</button>
<div class="item js-item">This is content</div>

CSS：

.item {
    display: none;
}

.item_visible {
    display: block;
}

JS代码：

$(document).ready(function() {
    var $item = $('.js-item');

    if (localStorage.getItem('isVisible') === 'true') {
        $item.addClass('item_visible');
    }

    $('.js-button').on('click',function() {
       $item.toggleClass('item_visible');
       localStorage.setItem('isVisible',$item.hasClass('item_visible'));
    });
});

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

hidehtmljavascriptjqueryshow