您好,这里是 javascript 和 jquery 的新手,完全不知道我在做什么。我有 4 个复选框。 1 到 4。我需要有 1 和 2 个复选框,当其中一个或两个被选中时显示隐藏的#div1 并取消选中复选框 3 和 4(如果它们被选中)并隐藏 div2(如果显示)。然后 3 和 4 复选框当一个或两个被选中时显示隐藏 #div2 并取消选中复选框 1 和 2(如果它们被选中)并隐藏 div1 如果显示。
这是我的 html,没有任何 javascript。尝试了一些,但我不太擅长。
<html>
<head>
<style type="text/css">
<!--
.divstyle
{
display: none;
border: 1px solid #000;
height: 100px;
width: 200px;
margin: 10px 0 0 0;
}
-->
</style>
</head>
<body>
<p>
<input name="chk1" type="checkbox" id="chk1"/>
Group1 Black
<input name="chk2" type="checkbox" id="chk2"/>
Group1 White
<input name="chk3" type="checkbox" id="chk3"/>
Group2 Red
<input name="chk4" type="checkbox" id="chk4"/>
Group2 Blue</p>
<div class="divstyle" id="div1">This is Group 1 for Black and White</div>
<div class="divstyle" id="div2">This is Group 2 for Red and Blue</div>
</body>
</html>
我希望我在这里说得有道理。
你们能帮忙吗?提前致谢。
最佳答案
这应该适合你:
$("#chk1, #chk2").click(function(){
$("#chk3, #chk4").removeAttr("checked");
$("#div1").show();
$("#div2").hide();
});
$("#chk3, #chk4").click(function(){
$("#chk1, #chk2").removeAttr("checked");
$("#div2").show();
$("#div1").hide();
});
只需注册一个.click()
id
所针对的复选框的处理程序。使用 .removeAttr()
取消选中其他框。然后使用 .show()
和 .hide()
显示正确的 div。
关于javascript - 如何显示带有复选框的div并取消选中其他复选框的其他复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5755672/