javascript - Javascript条件运算符无法正常运行

我试图根据布尔值使按钮更改状态。看起来可以正常工作，我以为可以，但是变成白色了。

知道为什么吗？请帮忙。

function dropDown(){
    var isClicked = false;
    var button = document.getElementById("bigbutton");

    if(isClicked == false){
        button.style.backgroundColor = "red";
        isClicked = true;
    }

    if(isClicked == true){
        button.style.backgroundColor = "white";
        isClicked = false;
    }
}

最佳答案

您需要使用else或返回。现在，您将isClicked设置为false，获取元素，然后运行第一个if块。然后将isClicked设置为true，然后它将运行第二个if块。您可能想要的是：

if(isClicked){
    button.style.backgroundColor = "white";
    isClicked = false;
} else {
    button.style.backgroundColor = "red";
    isClicked = true;
}

但是，这可能也不起作用，因为isClicked在此函数本地，因此始终为false。相反，您应该做的是检查按钮的属性，也许是backgroundColor，并将其用作条件控件：

var bgColor = button.style.backgroundColor
if(bgColor === "red"){
    button.style.backgroundColor = "white";
} else {
    button.style.backgroundColor = "red";
}