Javascript"；如果；声明不起作用

我对使用Javascript编程还不熟悉。我已经试着修正这个“如果”的说法好几个小时了。我看不出有什么问题。请看一下，告诉我怎么了

钮扣{
字号：14px
}
按钮隐藏{
显示：无
}
糖果盒翻拍
var-candies=0；
函数addCandies（）{
糖果++；
document.getElementById（'numberOfCandies'）.innerHTML=“您得到了”+candies+“candies。”；
};
函数add10Candies（）{
糖果+=10；
document.getElementById（'numberOfCandies'）.innerHTML=“您得到了”+candies+“candies。”；
};
函数throwCandies（）{
糖果-=10；
document.getElementById（'numberOfCandies'）.innerHTML=“您得到了”+candies+“candies。”；
};
如果（糖果>=30）{
document.getElementById（'add10Candies'）.style.display=“block”；
};
您得到了0块糖果
买一块糖果。
扔掉10块糖果。
买10个糖果。

在每个函数中放入

if语句。目前，当页面加载时，它只运行一次。
问题是，当您加载页面时，此
if
检查只运行一次。
一种可能的解决方案是创建一个在所有其他函数中调用的
checkCandies（）
函数：

var candies = 0;
function addCandies() {
    candies ++;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandies();
};
function add10Candies() {
    candies += 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandies();
};
function throwCandies() {
    candies -= 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandies();
};

function checkCandies() {
    if (candies >= 30) {
        document.getElementById('add10Candies').style.display = "block";
    };
}

您应该将
if
语句放在更改糖果数量的其他函数中

function addCandies() {
    candies ++;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";

    checkCandies();
}

function add10Candies() {
    candies += 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";

    checkCandies();
}

function throwCandies() {
    candies -= 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";

    checkCandies();
}

function checkCandies() {
    if (candies >= 30) {
        document.getElementById('add10Candies').style.display = "block";
    }
}

将代码放入函数中：

function checkCandiesQuantity() {
    if (candies >= 30) {
        document.getElementById('add10Candies').style.display = "block";
    } else {
        document.getElementById('add10Candies').style.display = "none";
    }
}

更新数量时调用它：

function addCandies() {
    candies ++;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandiesQuantity();
};

function add10Candies() {
    candies += 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandiesQuantity();
};

function throwCandies() {
    candies -= 10;
    document.getElementById('numberOfCandies').innerHTML = "You got " + candies + " candies.";
    checkCandiesQuantity();
};

您需要添加此代码

if (candies >= 30) {
    document.getElementById('add10Candies').style.display = "block";
};

在您定义的每个函数中

现在发生的事情：

步骤1：

var candies = 0;

步骤2：

<declarations of functions>

因此，在初始化和函数声明之后，控件将直接传递给您的
if
条件，因为
candies=0
不会发生任何事情

当您调用这些函数中的任何一个时，函数都会执行，但由于
如果
条件在函数之外，它就不会执行。
也许编写此函数的一种更简单的方法是（也有越来越多的“simpler”级别）。尽可能重用代码的公共位

PS：我修复了邮件中的语法错误：

<script type="text/javascript">
var candies = 0;
function updateCandies() {
    var e = document.getElementById('numberOfCandies');
    e.innerHTML = "You [edit:] have " + candies + " candies.";
    e.style.display = candies>=30 ? "block" : "none";
}

function addCandies() {
    candies ++;
    updateCandies();
};
function add10Candies() {
    candies += 10;
    updateCandies();
};
function throwCandies() {
    candies -= 10;
    updateCandies();
};
</script>


var-candies=0；
函数updateCandies（）{
var e=document.getElementById（'numberOfCandies'）；
e、 innerHTML=“您[编辑：]有“+糖果+”糖果。”；
e、 style.display=糖果>=30？“块”：“无”；
}
函数addCandies（）{
糖果++；
更新条件（）；
};
函数add10Candies（）{
糖果+=10；
更新条件（）；
};
函数throwCandies（）{
糖果-=10；
更新条件（）；
};
我添加了checkIs30Candies（）函数。
还将样式更改为style.display=“inline block”（在您的情况下，我想它必须是inline block）

你有一个打字错误


获取10个糖果。
您需要告诉代码何时运行if语句。目前，当脚本加载时，它只运行一次，此时candies将始终为0。对于
按钮，您缺少一个
，请扔掉10个candies
按钮，请创建一个函数来设置您的innerHTML，因为它是干的<代码>函数setHtml（id，newContent）{document.getElementById（id）.innerHTML=newContent；}
<script type="text/javascript">
var candies = 0;
function updateCandies() {
    var e = document.getElementById('numberOfCandies');
    e.innerHTML = "You [edit:] have " + candies + " candies.";
    e.style.display = candies>=30 ? "block" : "none";
}

function addCandies() {
    candies ++;
    updateCandies();
};
function add10Candies() {
    candies += 10;
    updateCandies();
};
function throwCandies() {
    candies -= 10;
    updateCandies();
};
</script>