时间戳

首页 > 解决方案 > 在单击 html 表格行时，我如何指定每一行？

javascript - 在单击 html 表格行时，我如何指定每一行？

问题描述

假设我有代码。

<tbody>
  <tr id="a1">
    <td>a2</td>
    <td>a2</td>
  </tr>
  <tr id="a3">
    <td>4d</td>
    <td>a23</td>
  </tr>
</tbody>

如果我想获取我单击的行的 id 值。

<script>
$('tr').click(function(){
  var a = //something values
  alert(a);
});
</script>

我应该在里面放什么？

对于另一个问题（这是上述问题的原始问题），当我有以下代码时

<tbody>
  <tr>
    <td>a2</td>
    <td>a2</td>
  </tr>
  <tr>
    <td>4d</td>
    <td>a23</td>
  </tr>
</tbody>

如果我想要行的第二个 td 值，我应该单击哪个脚本代码？

标签： javascriptjquery

解决方案

您可以使用此对象，从中获取id属性：

$('tr').click(function(){
  var a = this.id
  alert(a);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr id="a1">
      <td>a2</td>
      <td>a2</td>
    </tr>
    <tr id="a3">
      <td>4d</td>
      <td>a23</td>
    </tr>
  </tbody>
</table>

要获得第二个td，您可以使用find()和eq()

$('tr').click(function(){
  var secondTD = $(this).find('td').eq(1).text();
  alert(secondTD);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr id="a1">
      <td>a2</td>
      <td>a2</td>
    </tr>
    <tr id="a3">
      <td>4d</td>
      <td>a23</td>
    </tr>
  </tbody>
</table>

推荐阅读