gpt4 book ai didi

jquery - 这段代码缺少什么?

转载 作者:太空宇宙 更新时间:2023-11-04 01:30:26 24 4
gpt4 key购买 nike

我试图在点击时让绿色圆圈在红色和绿色之间交替。该代码对我来说看起来不错,但它不起作用,所以一定是出了什么问题。我犯了什么初学者错误?

$("#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%;
}

最佳答案

由于 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>

关于jquery - 这段代码缺少什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47231551/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com