javascript - 我希望不显示0，在FULL之前保持显示0

我有一个使用javascript和localStorage的简单程序。有一个等于10的可变插槽。当我单击“扣除”时，它会减少。但是问题是它在document.getElementById（'slot'）。innerText =“ FULL”;之前显示0（零）；将触发。我不知道为什么我想要的是当插槽达到0时，它尚未显示零，并且显示FULL。

Javascript：

    window.onload = function(){
    slot = localStorage.getItem("slot");

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

    document.getElementById("slot").innerText = slot;
    document.getElementById("button1").addEventListener('click', function(e){
        e.preventDefault();
        reduceSlot();
    })
}

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";
    }
}

HTML：

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

这是链接：
http://jsfiddle.net/K8stQ/

最佳答案

还不清楚您想要什么，但是如果您希望最后一个元素为1，则可以采用以下解决方案：

代替

if (slot >= 1) {

采用

if (slot > 1) { //simply "greater", instead of "greater or equal"

为什么需要这个？让我们清除此块：

if (slot >= 1) { //checks if slot is greater than, or equal to 1.
    slot--;     // **in this case**, equivalent to slot = slot-1;
    document.getElementById("slot").innerText = slot; //set the value of slot to element
    localStorage.setItem("slot", slot);
}
else {
    document.getElementById('slot').innerText = "FULL";
    document.getElementById("button1").style.display = "none";
}

现在，让我们看看出了什么问题。


方法称为
插槽是2


如果条件评估为真，则执行该分支
插槽减少，现在插槽1
slot（1）的值设置为元素
方法结束

再次调用方法
插槽是1


如果条件评估为真，则执行该分支
插槽减少，现在插槽为0-OOPS，这是我们不想要的
slot（0）的值设置为元素
方法结束

再次调用方法
插槽为0

如果条件评估为假，则执行else分支
值FULL设置为元素
方法结束



因此，该怎么做：提前1步停止：不允许广告位到达1 ...

关于javascript - 我希望不显示0，在FULL之前保持显示0，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19198021/