Jquery 选择器按其值获取下拉列表

Question

我找不到找到具有特定值的下拉列表的方法。

ex1:

$('[value="' + $(e.currentTarget).attr('name') + '"]')

给我选择值。

ex2:

$('[value="' + $(e.currentTarget).attr('name') + '"]').parent()

给我正确的下拉菜单。但是，如果我有多个 <select> 元素具有相同值的选项，我会得到更多结果。

无法通过值找到 <select> 个元素？

提前致谢

Answer 1

:has() selector can be used to target SELECT and for :selected selector 表示选择的选项。

Selects elements which contain at least one element that matches the specified selector.

var selects = $('select:has(option:selected[value="' + $(e.currentTarget).attr('name') + '"])');

var v = 1;
var selects = $('select:has(option:selected[value="' + v + '"])')
selects.css('color', 'green')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="0">0</option>
  <option value="1">1</option>
</select>
<select>
  <option value="2">2</option>
</select>
<select>
  <option value="0">0</option>
  <option value="1" selected>1</option>
</select>

或者，使用 .filter()

var selects = $('select').filter(function() {
   return $(this).val() == $(e.currentTarget).attr('name');
});

var v = 1;
var selects = $('select').filter(function() {
  return $(this).val() == 1;
});
selects.css('color', 'green')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="0">0</option>
  <option value="1">1</option>
</select>
<select>
  <option value="2">2</option>
</select>
<select>
  <option value="0">0</option>
  <option value="1" selected>1</option>
</select>

Jquery 选择器按其值获取下拉列表

Jquery selector to get dropdown by its value

jquery

select

selector

jquery-selectors