在行上單擊表中獲取隱藏的列值

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/

單擊此處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

\n

\n

\n

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

\n

\n

\n