将单元格值从表格复制到文本框

Question

我有下表。我想将所选行上的 Id 值复制到文本框。如果我单击第一行中的链接“选择”，文本框值将为 0001。

如果表格需要修改以获得更好更快的结果，请留下您的建议。

<div>
    <input id="selectedId" type="text" />
  </div>

  <table cellspacing="1" class="tablesorter" id="nameList">
    <thead>
      <tr>
        <th class="header">Name</th>

        <th class="header">Id</th>

        <th class="header">Gender</th>

        <th>Select</th>
      </tr>
    </thead>

    <tbody>
      <tr>
        <td>Akom Smith</td>

        <td>0001</td>

        <td>M</td>

        <td><a href="#" class="click-to-select">Select</a></td>
      </tr>

      <tr>
        <td>Amara Sahara</td>

        <td>0002</td>

        <td>F</td>

        <td><a href="#" class="click-to-select">Select</a></td>
      </tr>

      <tr>
        <td>John Lache</td>

        <td>0003</td>

        <td>M</td>

        <td><a href="#" class="click-to-select">Select</a></td>
      </tr>
    </tbody>
  </table>

Answer 1

试试这个，

$('a.click-to-select').click(function() {
    var id = $(this).closest('tr').find('td').eq(1).text();
    $('#selectedId').val(id);
    return false;
});​

简单酷的演示

为下面的评论添加了注释。

$('a.click-to-select').click(function() {
    var id = $(this).closest('tr').find('td.id').text();
    $('#selectedId').val(id);
    return false;
});​

更新了演示

Answer 2

好吧，您知道您的密钥是该行中的第二个 td。您可以像这样使用 :nth-child 选择器：

<script type="text/javascript">
var getUniqueId = function() {
     return $('td:nth-child(2)').text();
}
</script>

当然，您需要一种方法来识别正确的 , 但我假设应该从每个选择器调用代码，并且您可以使用父选择器。

否则，我会在每一行中放置一个 id 属性以使选择更容易。