jquery - 查找父表的第一个兄弟 - jquery

Question

我有 2 个表，其中有一些带有一些图像按钮的行。我想要做的是，当我单击图像按钮时，显示位于包含单击图像按钮的表格正下方的 div。

<table id="Table1">
  <tr>
     <td><input type="image" src="Images/info.jpg" class="infoButton" /></td>
  </tr>
</table>
<div class="info">            
</div>

<table id="Table2">
  <tr>
     <td><input type="image" src="Images/info.jpg" class="infoButton" /></td>
  </tr>
</table>
<div class="info">            
</div>

到目前为止我所做的是：

$('.infoButton').click(function () {                          
    $(this).closest('table').siblings().filter(":first").show();
});

当我单击第一个表内的按钮时，此方法有效。然后它显示正确的 div（表 1 下的那个）。当我单击表 2 中的按钮时，它再次显示相同的 div。我希望它显示表 2 下的 div。

Answer 1

$('.infoButton').click(function () {                          
    $(this).closest('table').next('div').show();
});

演示

Answer 2

推荐使用 jQueryparents函数，它增加了可读性并为此目的而构建。

$('.infoButton').click(function () {
$(this).parents('table').next('div').show(); });