使用jQuery我正在尝试创建一个函数来显示和隐藏已单击的 table/tr 下面的 DIV，但是当我单击其中一个时，所有 DIV 都会向上滑动，也会向下滑动，但它不起作用。
我尝试了 if ($(".container:first").is("hidden")) 但我猜不是单击的元素下的第一个元素，而是文档上的第一个元素。
我如何让它工作？
基于以下示例。
<html>
<head>
<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".header").click(function(){
if ($(".container").is("hidden")){
$(".container").slideUp("slow");
} else {
$(".container").slideDown("slow");
}
});
});
</script>
</head>
<body>
<table class="header">
<tr><td>Row1</td></tr>
</table>
<div class="container">Container 1</div>
<table class="header">
<tr><td>Row2</td></tr>
</table>
<div class="container">Container 2</div>
</body>
</html>
最佳答案
您只想获取下一个容器，因此您可以使用$.next():
$(".header").click(function(){
$(this).next(".container").slideToggle();
});
在线演示:http://jsbin.com/eyuwi3/edit
已更新
评论中要求的是使其“在 tr 元素上工作”。如果您单击表中的任何位置，表的单击事件最终都会触发 - 除非子级停止传播。
如果此代码不起作用，那么您的问题出在其他地方。确保表格和 .container 元素之间没有任何元素。 $.next() 仅选择直接 sibling ，这是您的示例代码建议您拥有的。
如果问题仍然存在，您可以尝试以下操作:
$(".header").click(function(){
$(this).nextAll(".container:first").slideToggle();
});
关于jQuery 选择器？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2343257/