Question

我有一个包含四列的表格。前两列是隐藏的。我想在行单击时获取第二列和第三列的值。我可以使用下面的代码获取第三列的值。但是，如何获得隐藏列的值？

$('body').on( 'click','#item-grid table tbody tr', function() {
    $('#PurchaseOrder_supplier_name').val($(this).children(':nth-child(3)').text());
});

下面是表格html。

<table class="table table-bordered table-condensed table-hover table-striped dataTable">
  <thead>
    <tr>
      <th id="item-grid_c0" style="display:none">Supplier ID</th>
      <th id="item-grid_c1" style="display:none">Supplier ID</th>
      <th id="item-grid_c2"><a href="/builders_common/index.php?r=purchase/purchase/multipurchaseorderdetailview&amp;PurchaseOrder%5Bvoucher_no%5D=12&amp;PurchaseOrderDetails%5Bpurchase_voucher_no%5D=12&amp;PurchaseOrderDetails%5Bproject_id%5D=45&amp;PurchaseOrderDetails%5Bitem_id%5D=79&amp;ajax=item-grid&amp;sort=supplier"
        class="sort-link">Supplier</a>
      </th>
      <th id="item-grid_c3"><a href="/builders_common/index.php?r=purchase/purchase/multipurchaseorderdetailview&amp;PurchaseOrder%5Bvoucher_no%5D=12&amp;PurchaseOrderDetails%5Bpurchase_voucher_no%5D=12&amp;PurchaseOrderDetails%5Bproject_id%5D=45&amp;PurchaseOrderDetails%5Bitem_id%5D=79&amp;ajax=item-grid&amp;sort=item"
        class="sort-link">Item</a>
      </th>
      <th id="item-grid_c4"><a href="/builders_common/index.php?r=purchase/purchase/multipurchaseorderdetailview&amp;PurchaseOrder%5Bvoucher_no%5D=12&amp;PurchaseOrderDetails%5Bpurchase_voucher_no%5D=12&amp;PurchaseOrderDetails%5Bproject_id%5D=45&amp;PurchaseOrderDetails%5Bitem_id%5D=79&amp;ajax=item-grid&amp;sort=rate"
        class="sort-link">Rate</a>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr class="odd selected">
      <td style="display:none">
        <input type="hidden" id="ProjectPurchaseOrderSupplierwise_item_id_5" name="ProjectPurchaseOrderSupplierwise[item_id_5]" value="79" class="gridfield">
      </td>
      <td style="display:none">
        <input type="hidden" id="ProjectPurchaseOrderSupplierwise_supplier_id_5" name="ProjectPurchaseOrderSupplierwise[supplier_id_5]" value="14" class="gridfield">
      </td>
      <td>General</td>
      <td>Cement</td>
      <td>
        <input type="text" id="ProjectPurchaseOrderSupplierwise_rate_5" name="ProjectPurchaseOrderSupplierwise[rate_5]" value="50.00" readonly="readonly" class="gridfield">
      </td>
    </tr>
  </tbody>
</table>

Answer 1

尝试如下。

$('body').on( 'click','#item-grid table tbody tr', function() {
    $(this).find('td:eq(1) input').val(); // 2nd column
    $(this).find('td:eq(2)').text(); // 3rd column
});

Answer 2

您可以使用以下两种方法之一：eq（）选择器或：nth-child（）选择器。

https://api.jquery.com/nth-child-selector/

https://api.jquery.com/eq-selector/

点击这里 Example code with your HTML

要按索引获取特定单元格，您可以使用：

 $(this).find('td:nth-child(2) input').val(); // 2nd column

 $(this).find('td:eq(1) input').val(); // 2nd column

 $(this).find('td:nth-child(3)').text(); // 3rd column
 $(this).find('td:eq(2)').text(); // 3rd column

Answer 3

$('#PurchaseOrder_supplier_name').val($(this).children(':nth-child(3):visible').text());

在行单击时获取表中的隐藏列值

3 个答案: