如何在按钮单击时获取最接近td的值？

Question

我有数据和按钮的表行。 http://codepen.io/leongaban/pen/nuIkd

每个按钮对应于每一行，当您单击一个按钮时，它将类名从hide更改为un_hide ，下一步是在单击的按钮所属的行中检索具有类contact_name的td的文本值。

表结构：

<tr>
  <td class="contact_name" style="padding: 7px 0;">
    Name 1
  </td>
  <td>
      <button class="btn_hide">Hide</button>
  </td>
</tr>
<tr>
  <td class="contact_name" style="padding: 7px 0;">
      Name 2
  </td>
  <td>
      <button class="btn_hide">Hide</button>
  </td>
</tr>

使用这个jQuery，它将在所有行中获得.contact_name的所有文本值

var name = $('.contact_name').text();

所以我试着得到'最接近'.contact_name td的文本值

var name = $(this).closest('.contact_name').text();

然而，这对我来说是空白的:(

如何通过单击第一个“隐藏”按钮获取“ 名称1”值？

Answer 1

.contact_name不是单击按钮的父级。

var name = $(this).closest('tr').find('.contact_name').text();

Answer 2

尝试，

var name = $(this).closest('td').prev('.contact_name').text();

要么

var name = $(this).closest('tr').find('.contact_name').text();

DEMO

Answer 3

var name = $(this).closest('tr').children('.contact_name').text();