Jquery通過td中的隱藏輸入字段值選擇tr

Question

我是jQuery語言的初學者，我有一個問題。

我的網站上有一個這樣的表：

<table id="filter-table" class="table table-striped">
  <thead>
    <tr>
      <th>Code</th>
      <th>Name</th>
      <th>Typology</th>
      <th>Select</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>IYCE8</td>
      <td>NAME</td>
      <td>
        <input class='typology' type='hidden' value='1'>TYPE1
        <input class='typology' type='hidden' value='2'>TYPE2
        <input class='typology' type='hidden' value='3'>TYPE3
      </td>
      <td>
        <input type="checkbox">
      </td>
    </tr>
    <tr>
      <td>IYCE9</td>
      <td>NAME2</td>
      <td>
        <input class='typology' type='hidden' value='1'>TYPE1
        <input class='typology' type='hidden' value='2'>TYPE2
      </td>
      <td>
        <input type="checkbox">
      </td>
    </tr>
  </tbody>
</table>

如您所見，行具有與類型相關聯的隱藏輸入（type1 => 1）。

使用下拉選擇器我選擇一個值：

<select id="filter" name="filter">
  <option value="">SELECT ONE</option>
  <option value="1">TYPE1</option>
  <option value="2">TYPE2</option>
  <option value="3">TYPE3</option>
</select> 

使用過濾器中的事件OnChange我想要選擇表中具有輸入字段值=的所有行到下拉列表中選擇的行

我怎么能用Jquery做到這一點？ 在此先感謝所有的幫助

Answer 1

您可以組合一個屬性選擇器和:has()選擇器 ：

這里的例子

$('#filter').on('change', function () {
  var $tr = $('#filter-table tr:has(.typology[value="' + this.value + '"])');
});

在上面的代碼片段中， $tr是一個jQuery對象，它包含所有desendant tr元素，這些元素包含一個帶有.typology類的.typology和一個與所選值對應的value屬性。

Answer 2

您可以先獲取所需的值，然后將其用於您需要查找的任何內容：

$('#filter').on('change', function () {
  var selected_val = this.value;
  var els_needed = $('#filter-table').children().find('input.typology[value="'+selected_val+'"]');
});