【问题标题】：Copy cell value from table to textbox将单元格值从表格复制到文本框
【发布时间】：2010-09-21 16:06:10
【问题描述】：

我有下表。我想将所选行上的 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>

【问题讨论】：

标签： javascript jquery html jquery-selectors

【解决方案1】：

试试这个，

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

simple cool demo

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

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

updated demo

【讨论】：

我喜欢很酷的演示。谢谢你。如果有一个像这样的类 'td' 0001，语法会是怎样的？

【解决方案2】：

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

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

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

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

【讨论】：