0

问题是当我单击按钮时它会减少插槽并且很好。假设剩余的插槽是 9,但是当我刷新浏览器时它会回到 10 但是当我再次单击时它已经是 8,因为我之前已经扣除了它。我担心的是,当我刷新浏览器时,它总是将插槽显示为 10。我不知道为什么?

<script>
    var slot = localStorage.getItem("slot");

    if (slot == null) {
        slot = 10;
    }

    document.getElementById("slot").innerText = slot;

    function reduceSlot() {
        if (slot >= 1) {
            slot--;
            document.getElementById("slot").innerText = slot;
            localStorage.setItem("slot", slot);
        }
        else {
            document.getElementById('slot').innerText = "FULL";
            document.getElementById("button1").style.display = "none";
        }
    }

    document.getElementById("button1").onclick = reduceSlot;

    function clearLocalStorage(){
        localStorage.clear();
    }
    </script>

<body>
<p id="slot">10</p>
<a href="javascript:reduceSlot(1)" id="button1">Deduct</a>
<button onclick="window.localStorage.clear();">Clear All</button>
</body>

我需要你的帮助来完成我的任务。

4

0 回答 0