Question

我想在单击后保存按钮状态（更改类名称），经过几个小时的搜索，我发现了两个代码，但是它们均无法正常工作，刷新后设置了默认类，有人可以告诉他们这是什么问题？

<script>
    var retrievedObject = localStorage.getItem('classChange');
    if (retrievedObject) {
        $('#tick').addClass(retrievedObject)
    }  
    $("#tick").click(function () {
        if ($(this).hasClass("btn btn-light")) {
            $(this).removeClass('btn btn-light').addClass('.btn btn-success');
            localStorage.setItem('class', '.btn btn-success');
            return false;
        } else {
            $('.btn btn-success').removeClass('.btn btn-success').addClass('btn btn-light');
            localStorage.setItem('classChange', 'btn btn-light');    
            return false;
        }
    });
</script>

<script type="text/javascript">
    $(document).ready(function () {
        if (localStorage.getItem('classChange'))
            $(this).toggleClass('.btn btn-success');

        $('#tick').on('click', function () {          
            $(this).toggleClass('.btn btn-success');
            localStorage.setItem('classChange', true);           
            return false;
        });


    });
</script>

Answer 1

基本上不要将句点存储在本地存储值中，请确保名称一致，并且无需在班级中存储“ btn”

<script>
    var retrievedObject = localStorage.getItem('classChange');
    if (retrievedObject) {
        $('#tick').addClass(retrievedObject)
    }  
    $("#tick").click(function () {
        if ($(this).hasClass("btn-light")) {
            $(this).removeClass('btn-light').addClass('btn-success');
            localStorage.setItem('classChange', 'btn-success');                
        } else {
            $(this).removeClass('btn-success').addClass('btn-light');
            localStorage.setItem('classChange', 'btn-light');                
        }
    });
</script>

刷新后如何保存按钮状态（更改类名称）？

1 个答案: