如何解决选择特定类别的选择器的子项
| 我使用jQuery,并尝试使用具有“ \ menuElement \”类的div列表创建菜单。每个menuElment div都有一个与特定菜单项相对应的ID。每个div menuElement都有两个div,它们的类为menuElementHeader和menuElementBody。我想最初显示menuElementHeader div,当用户选择menuElementHeader时,将使用.show()方法显示相应的menuElementBody。我该如何使用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();
});
, 我认为这就是您想要的:)
http://jsfiddle.net/jansian/bZHtJ/1/
, 您是否正在尝试做这样的事情?
http://jsfiddle.net/xzpkq/
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。