我的页面上有 2 种类型的 div。第一种是“主项”,第二种是“子项”。我使用 css 隐藏了子项,我想在我们单击主项时显示它们。我试过了,但没有用。
HTML
<div class="item">
Item 1
<div class="sub-item">
Sub Item 1
</div>
</div>
<div class="item">
Item 2
<div class="sub-item">
Sub Item 2
</div>
</div>
<div class="item">
Item 3
<div class="sub-item">
Sub Item 3
</div>
</div>
<div class="item">
Item 4
<div class="sub-item">
Sub Item 4
</div>
</div>
<div class="item">
Item 5
<div class="sub-item">
Sub Item 5
</div>
</div>
CSS
.menu .item {
color: White;
width: 250px;
vertical-align: middle;
line-height: 35px;
color:black;
}
.menu .sub-item {
margin-left: 15px;
display:none;
}
JS/jQuery
$(".item").click(function() {
$(this).child().show();
});
此外,这是 fiddle :jsFiddle
最佳答案
没有child
函数。您可能想使用 children但更有选择性更清洁。使用这个:
$(".item").click(function() {
$('.sub-item', this).show();
});
关于javascript - 点击()不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17028098/