此代码缺少什么？
我试图让点击时绿色的圆形在红色和绿色之间交替。代码看起来很好，但它不起作用，所以一定是错的。我在做什么初学者错误？此代码缺少什么？
$("#greenCircle").click(function() {
console.log($("#greenCircle").css("background-color"));
if ($("#greenCircle").css("background-color") == "red") {
$("#greenCircle").css("background-color", "green");
} else {
$("#greenCircle").css("background-color", "red");
}
});#greenCircle {
background-color: green;
height: 150px;
width: 150px;
border-radius: 50%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="greenCircle"></div>我要去绝对疯了！我只是做一个简单的jQuery动画，而且它只是不起作用。一切看起来正确。我甚至去切换文本编辑器，什么都没有。这是动画的代码。
<!DOCTYPE html>
<html>
<head>
<title>JQuery</title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="jQuery Practice.css">
</head>
<body>
hello
<div id="circle"></div>
<script type="text/javascript">
$("#circle").click(function(){
$("#circle").animate({Width:"400px"}, 2000);
});
</script>
</body>
#circle{
width: 150px;
height: 150px;
background-color: green;
border-radius: 50%;
}
如果你想要去的这种方法only-的RGBa（红色，蓝色，绿色，阿尔法 - 不透明度）表示颜色的计算值，而不是以颜色名称（如红色，蓝色，橙色，透明等）或十六进制值表示。
$("#greenCircle").click(function() {
if ($("#greenCircle").css("background-color") == 'rgb(255, 0, 0)') {
$("#greenCircle").css("background-color", "green");
} else {
$("#greenCircle").css("background-color", "red");
}
});#greenCircle {
background-color: green;
height: 150px;
width: 150px;
border-radius: 50%;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="greenCircle"></div>
由于CSS将返回RGB格式的颜色，使用的一类，你可以打开/关闭将使这容易得多。
$("#greenCircle").click(function() {
$("#greenCircle").toggleClass('red');
});#greenCircle {
background-color: green;
height: 150px;
width: 150px;
border-radius: 50%;
}
#greenCircle.red {
background-color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="greenCircle"></div>
$("#greenCircle").css("background-color")返回解析的颜色等"rgb(0, 128, 0)"，这是不等于"red"或"green"。
如果您使用课程设置颜色，则会更简单，那么您可以使用toggleClass()。
$("#circle").click(function() {
$(this).toggleClass("greenCircle redCircle");
});#circle {
height: 150px;
width: 150px;
border-radius: 50%;
}
.greenCircle {
background-color: green;
}
.redCircle {
background-color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="circle" class="greenCircle"></div>
的CSS（ “背景色”）方法不会在你的风格属性，但一个RGB（）返回值实际值。 尝试使用的console.log来看看如何变化值的变化后：
console.log($("#greenCircle").css("background-color"));
也许我提出一个简单的替代方法：
<style>
#circle {
height: 150px;
width: 150px;
border-radius: 50%;
}
#circle.green{
background-color: green;
}
#circle.red{
background-color: red;
}
</style>
<script>
$("#circle").click(function(){
$(this).toggleClass('red', 'green');
});
</script>
<div id="circle" class="green"></div>
因此，代码是干净多了。
$("#greenCircle").click(function() {
$(this).toggleClass("red");
});#greenCircle {
background-color: green;
height: 150px;
width: 150px;
border-radius: 50%;
}
#greenCircle.red {
background-color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="greenCircle"></div>谢谢。我正在做一个Udemy教程，导师采取了这种方法。它似乎对他正确工作。这真的让我很烦恼。当我需要使用它时，我会寻求其中一种选择。 – Reese
只需添加该代码并更改ID，以类
$(".red").click(function() {
$(this).toggleClass('greenCircle red');
});
.greenCircle {
background-color: green;
height: 150px;
width: 150px;
border-radius: 50%;
}
.red {
background-color: #f00;
height: 150px;
width: 150px;
border-radius: 50%;
}
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="red"></div>
你得到什么行为？ –
IIRC，使用css获取作为颜色的字段的值将以rgb（）格式返回值，而不是“红色”或“绿色”。这很容易做到这一点最有可能的类 – Taplar