当我单击一个单选按钮时,如果它是列表中的最后一个,它会显示所有隐藏的 div,并且当我选择另一个单选按钮时不会关闭所有打开的 div。我知道我已经很接近了...但是缺少一些东西。
$(document).ready(function() {
$('input').on('change',function(){
$(".groupNumber").hide().filter(":lt(" + this.value + ")").slideToggle("slow");
});
});
我以为我是通过在链的开头设置“隐藏”来处理它的。
HTML
<table cellpadding="0" cellspacing="0">
<tr>
<td width="25"><input type="radio" name="rNumber" value="1"></td>
<td width="25"><input type="radio" name="rNumber" value="2"></td>
<td width="25"><input type="radio" name="rNumber" value="3"></td>
</tr>
</table>
div如下:
<div id="grp1" class="groupNumber">Content Here</div>
<div id="grp2" class="groupNumber">Content Here</div>
<div id="grp3" class="groupNumber">Content Here</div>
我想要的是相应单选按钮的 div 可见并关闭任何其他可能打开的单选按钮。
最佳答案
那是因为您正在使用lt
,所以您应该使用eq
。试试这个。
使用lt
,您将获得所有小于要显示的索引值的div,因此它会显示该div以及所有之前的div。相反,只需使用 eq
来获取要从集合中显示的 div。
$(document).ready(function() {
$('input').on('change',function(){
$(".groupNumber").hide().eq((+this.value -1)).slideToggle("slow");//Probably Slide toggle probably doesn't make sense here as change event won't be triggered if you select the same option again.
});
});
Fiddle
关于javascript - 使用切换选择新单选按钮时隐藏 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16846077/