Question

这里我试图通过jquery获取所选行的特定列的值。以下代码我有两行没有任何id。我尝试了以下方式并获得该列的两个行值相互追加.how仅使用jquery获取该行的值。

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script type="text/javascript">

function test(){
var id = $(".use-address").closest("tr").find('td:eq(2)').text();
  alert(id);
}
    </script>

</head>
<body>
<table id="choose-address-table" class="ui-widget ui-widget-content">
  <thead>
    <tr class="ui-widget-header ">
      <th>Name/Nr.</th>
      <th>Street</th>
      <th>Town</th>
      <th>Postcode</th>
      <th>Country</th>
      <th>Options</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="nr"><span>50</span>

      </td>
      <td>Some Street 1</td>
      <td>Glas</td>
      <td>G0 0XX</td>
      <td>United Kingdom</td>
      <td>
        <button type="button" class="use-address" onclick="test();">Use</button>
      </td>
    </tr>
    <tr>
      <td class="nr"><span>30</span>
      </td>
      <td>Some Street 2</td>
      <td>Glasgow</td>
      <td>G0 0XX</td>
      <td>United Kingdom</td>
      <td>
          <button type="button" class="use-address" onclick="test();">Use</button>
      </td>
    </tr>
  </tbody>
</table>
</body>
</html>

Answer 1

您需要使用$(this)定位当前点击的按钮，而不是$(".use-address")：

function test(){
    var id = $(this).closest("tr").find('td:eq(2)').text();
    alert(id);
}

而不是内联onclick javascript，您可以使用.click()：

$('.use-address').click(function () {
    var id = $(this).closest("tr").find('td:eq(2)').text();
    alert(id);
});

<强> Fiddle Demo

Answer 2

我建议在每个列（td）中添加类，以便更容易和更具未来证明，例如将来将名称拆分为姓名或者在名称后添加电子邮件等。< / p>

<td class='country'>United Kingdom</td>

$('.use-address').click(function () {
    var id = $(this).closest("tr").find('td.country').text();
    alert(id);
});

如何通过jQuery获取所选行的列值

2 个答案: