Question

我试图在我的表中单击一行时检索行id数据，但是我得到了undefined而不是字符串。我通过使用其他方法（如数据链接而不是ID）在线尝试了许多不同的解决方案，但我遇到了同样的错误。我假设我可能会遗漏一些东西，因为我的表是从一个单独的php文件生成的（下图）。

echo "<tr id='aapl' class= $color>";
echo "<td>{$row['name']}</td>";
echo "<td>{$row['stock']}</td>";
echo "<td>{$row['invested']}</td>";
echo "<td>{$row['net_worth']}</td>";
echo "<td>{$percent_change}%  </td>";

该表在另一个php文件中定义：

<table id="stock_table" class="table table-hover">
     <thead>
         <tr>
           <th>Stock Name</th>
           <th>Ticker</th>
           <th>Invested</th>
           <th>Current Value</th>
           <th>Percent Change</th>
           <th>Sell</th>
         </tr>
     </thead>
     <tbody id="show_stocks">

     </tbody>
</table>

最后，jquery代码在与表相同的文件中定义，并且是：

$("#show_stocks").click(function(evt) {
  //display_stock = $(this).closest('tr').attr('id');
  alert($(this).closest('tr').attr('id'));
});

提前感谢您的帮助！

Answer 1

尝试为每一行提供常见的CSS类，并使用<tbody>将其应用于jQuery点击功能，因为<tbody>包含表格的所有行。
请查看以下更改...

<强> HTML

<tbody id="show_stocks">
    <tr class='myClass' id='101'>
      <td >Eliza</td>
    </tr>
    <tr class='myClass' id='102'>
        <td >Lizzy</td>
    </tr>
</tbody>

<强>的jQuery

$(".myClass").click(function(evt) {
  alert($(this).attr('id'));
});

JSFiddle Demo

Answer 2

相反，您应该将事件绑定到td，然后获取最接近的tr。

像这样：

$('td').click(function(){
  var id = $(this).closest('tr').attr('id');
  alert(id)
});

HTML：

<table id="stock_table" class="table table-hover">
     <thead>
         <tr>
           <th>Stock Name</th>
           <th>Ticker</th>
           <th>Invested</th>
           <th>Current Value</th>
           <th>Percent Change</th>
           <th>Sell</th>
         </tr>
     </thead>
     <tbody id="show_stocks">
        <tr id="aapl" class="">
            <td>John Doe</td>
            <td>Stock</td>
            <td>$90123</td>
            <td>$1990000</td>
        </tr>
     </tbody>
</table>

DEMO

使用Jquery从表中检索数据时未定义

2 个答案: