gpt4 book ai didi

jquery - 这用 jquery 选择了错误的元素

转载 作者:太空宇宙 更新时间:2023-11-03 23:14:38 25 4
gpt4 key购买 nike

我有一个简单的网页,其中包含三个样式为圆形和两个正方形的 div。单击 div 时,display 属性设置为 none,因此圆形/方形应该消失。当我点击第一个方 block (#square1)时,第二个方 block (#square2)消失了。为什么会这样?

<!doctype html>
<html>
<head>
<title>Learning jQuery</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript" src="http://code.jquery.com/jquerylatest.min.js">
</script>
<style type="text/css">
#circle{
width:100px;
height:100px;
border-radius:50px;
background:red;

}
#square1, #square2{
width:100px;
height:100px;
background:green;
margin-top:10px;

}
</style>
</head>

<body>
<div id="circle"></div>
<div id="square1"></div>
<div id="square2"></div>

<script>
$("div").click(function(){
$(this).css("display","none");
});
</script>
</body>
</html>

最佳答案

第二个方 block 没有消失,第一个方 block 消失了,第二个方 block 填满了它的位置,因为你正在设置 display: none;

尝试将 $(this).css("display","none"); 更改为 $(this).css("visibility","hidden");

并将您的 div 更改为:

<div id="square1">1</div>
<div id="square2">2</div>

这样您就可以看到实际上隐藏了哪些内容。

https://jsfiddle.net/jreljac/vhxkbnby/2/ 我已经更改了第二个方 block 的颜色(正如@Jonathan Lonowski 提到的)以帮助更好地看到差异

关于jquery - 这用 jquery 选择了错误的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31105133/

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