选择具有特定类别的选择器的孩子
问题描述:
即时通讯使用jQuery和即时通讯尝试创建一个菜单使用类别为“menuElement”类的div列表。每个menuElment div都有一个对应于特定菜单项的id。每个div menuElement都有两个div,分别是menuElementHeader和menuElementBody。我想最初显示menuElementHeader div,当用户选择menuElementHeader时,将使用.show()方法显示相应的menuElementBody。我如何使用teh menuElement div的id来做到这一点?选择具有特定类别的选择器的孩子
<ul class="horMenu">
<li>
<div class="menuElement" id="newTemplate">
<div class="menuElementHeader">New Template</div>
<div class="menuElementBody">add template info here</div>
</div>
</li>
<li>
<div class="menuElement" id="openTemplate">
<div class="menuElementHeader">Open Template</div>
<div class="menuElementBody">open template info here</div>
</div>
</li>
</ul>
答
注意两个要素不能有相同的ID!编辑:现在已更正。
根据您的描述,我认为你想:
$('.menuElementHeader').click(function() {
$(this).next('.menuElementBody').toggle();
});
隐藏与CSS所有.menuElementBody
开始:
.menuElementBody {
display: none;
}
或者,你可以在click
处理程序绑定到.menuElement
元素:
$('.menuElement').click(function() {
$(this).children('.menuElementBody').toggle();
});
这将是非常** **有益的,如果你可以发布你的HTML结构。 – 2011-05-31 09:41:08