我有一张桌子，第一个元素的类别为 inhalt
在此tr之后，更多tr，类 table2 。请参阅下面的HTML。
<div id="sh_details">
<div class="sh_wasserzeichen"></div>
<article>
<dl id="sh_accordion">
<dt id="sh_2016">Headline1</dt>
<dd><table>
<tr>
<th>Überschrift1</th>
<th>Überschrift2</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
</tr>
<tr>
<td class="inhalt">Inhalt1</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt2</td>
</tr>
<!--Untertabelle1-->
<tr class="table2">
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
</tr>
<tr class="table2">
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
</tr>
<tr class="table2">
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
</tr>
<tr>
<td class="inhalt">Inhalt4</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
</tr>
<!--Untertabelle2-->
<tr class="table2">
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
</tr>
<tr class="table2">
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
</tr>
</table></dd>
<dt id="sh_january">Headline2</dt>
<dd>125153226262Test</dd>
</dl>
</article>
</div>
我想做什么：
当用户点击带有 inhalt 类的td元素时，tr - 元素应该是slideDown（直到找到tr-element，它没有类< /强>）
jQuery的：
$(".inhalt").stop().click(function(){
$(this).addClass('table2_active');
$(this).parents().next('tr').each(function() {
if( $(this).attr('class') === undefined) { return false;}
else {
$(this).slideDown(300); }
});
});
这段代码只给了我第一个tr，而不是其他的。
请参阅fiddle。希望你们能解决问题。谢谢！
PS：同样“slideDown” - 动画也不顺畅 - 任何想法为什么？
//编辑：
所以基本上我的想法是建立一个遍历所有tr元素的循环直接点击.inhalt ITEM 后检查他们是否有类.table2，当是，滑下来，当没有时，打破循环。
答案 0 :(得分：0)
查看此更新的fiddle
HTML
<div id="sh_details">
<div class="sh_wasserzeichen"></div>
<article>
<dl id="sh_accordion">
<dt id="sh_2016">Headline1</dt>
<dd>
<table>
<tr>
<th>Überschrift1</th>
<th>Überschrift2</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
<th>Überschrift3</th>
</tr>
<tr>
<td class="inhalt">Inhalt1</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt3</td>
<td>Inhalt2</td>
<td>Inhalt2</td>
</tr>
<tbody>
<!--Untertabelle1-->
<tr class="table2">
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
<th>Sub_Überschrift1</th>
</tr>
<tr class="table2">
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
</tr>
<tr class="table2">
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
<td>Sub_Inhalt1</td>
</tr>
</tbody>
<tr>
<td class="inhalt">Inhalt4</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
<td>Inhalt5</td>
<td>Inhalt6</td>
</tr>
<tbody>
<!--Untertabelle2-->
<tr class="table2">
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
<th>Sub_Überschrift4</th>
</tr>
<tr class="table2">
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
<td>Sub_Inhalt4</td>
</tr>
</tbody>
</table>
</dd>
<dt id="sh_january">Headline2</dt>
<dd>125153226262</dd>
</dl>
</article>
</div>
的JavaScript
$(this).parents().next("tbody").find(".table2").each ...
答案 1 :(得分：0)
试试这个：
$(".inhalt").click(function(){
$(this).addClass('table2_active');
$(this).parent().next('tr').each(function() {
if($(this).hasClass('table2')) {
$(this).slideDown(300)
} else {
return false;
}
});
});