为什么我的本地存储在刷新后不保留变量的值?

时间:2020-08-20 12:58:44

标签: javascript json variables refresh

因此,我有一些代码想在转到另一页后保留某个变量的值,当我返回到原始页面并按某个按钮时,它会增加它的值并保持已扩展的值。问题在于代码似乎无法按预期工作。变量的默认值是0,在按下按钮时,它的值增加了2,并使用localstorage保存,然后我被发送到另一页,然后当我返回原始页面并再次按下相同的按钮时,变量是再次2.为什么? 这是我的代码:

$(document).ready(function()
{
    var isShoes = false
    var isShirt = false
    var oneMoreShoe = false
    var buttonClicked = 0;

    $('#purchaseShoes').on('click', function()
    {
        buttonClicked+=2;
        var Shoes = localStorage.setItem('img_shoes', '/static/Images/Sneakers.png')
        var clicksCounter = localStorage.setItem('buttonClicked', JSON.stringify(buttonClicked))
        var retainClicksCount = localStorage.getItem('buttonClicked')
        var actualClickCount = JSON.parse(retainClicksCount)
        isShoes = localStorage.setItem('isShoes', true)
        alert(retainClicksCount)
        if(retainClicksCount>= 4){
            oneMoreShoe = localStorage.setItem('oneMoreShoe', true)
         }
    })
    
})

1 个答案:

答案 0 :(得分:1)

$(document).ready(function()
{
    var isShoes = false
    var isShirt = false
    var oneMoreShoe = false
    var buttonClicked = 0;
    
    if (localStorage.getItem('buttonClicked')) // check if button click exists in storage and assign it to your variable
    {
        buttonClicked = localStorage.getItem('buttonClicked');
    }
    $('#purchaseShoes').on('click', function()
    {
        buttonClicked+=2;
        var Shoes = localStorage.setItem('img_shoes', '/static/Images/Sneakers.png')
        var clicksCounter = localStorage.setItem('buttonClicked', JSON.stringify(buttonClicked))
        var retainClicksCount = localStorage.getItem('buttonClicked')
        var actualClickCount = JSON.parse(retainClicksCount)
        isShoes = localStorage.setItem('isShoes', true)
        alert(retainClicksCount)
        if(retainClicksCount>= 4){
            oneMoreShoe = localStorage.setItem('oneMoreShoe', true)
         }
    })
})

每次更新页面时,buttonClicked变量变为=0。您需要检查是否存在局部变量,如果是这样,则可以从localstorage中获取脚本变量的值,然后添加2并使用它。