在 jQuery 中选择类中的下一个实例

Question

我有一个表格，其中交替排列课程名称和课程描述。以下是一些 html（我循环浏览的）：

<tr>
    <td><a class="course_name_click" href='#'><%= course.name %></a></td>
</tr>

<tr class="course_descrip" height="200">
    <td style="word-wrap: break-word" width="10"><%= course.descrip %></td>
</tr>

我想这样做，以便当用户单击课程名称时，课程描述幻灯片会上下切换。但我无法找到正确的选择器在单击的课程名称之后出现的课程描述。我尝试了 $(this) 和 .next( 的多种不同组合），但似乎都不起作用。到目前为止，这是我的 jquery：

  $('.course_name_click').click(function() {
    $('tr.course_descrip').slideToggle('slow');
    return false;
  });

如上面所示，单击任何课程名称幻灯片会切换 tr.course_descrip 的每个实例。我只希望它滑动切换单击的课程名称后出现的实例。

Answer 1

这是因为 $(this).next() 获取了被单击的 的下一个同级，这没什么。您必须获取其父级的父级（）并执行下一步操作：

$('.course_name_click').click(function() {
    $(this).parent().parent().next().slideToggle('slow');

    return false;
});

这是一个 jsFiddle 它的工作原理。

编辑：马特的回答可能比.parent().parent()更具语法意义

Answer 2

$('.course_name_click').click(function() {
  $(this).closest('tr').next().slideToggle('slow');
  return false;
});