Question

让所有selects与4 options完全匹配的最短途径是什么？

否则，我必须循环每个select并获取$find('option').length == 4

这似乎不起作用：

$.grep($("select:visible"), function () {
    return $(this).find('option').length == 4;
});

Answer 1

您可以使用:has()，:eq()和:not()选择器的组合。

表达式:has(option:eq(3))将定位具有alt-lest 4 option子元素的元素，而表达式:not(:has(option:eq(4)))将排除具有5 option子元素的元素。

$("select:visible:has(option:eq(3)):not(:has(option:eq(4)))").css('color', 'red')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
</select>

您也可以使用.filter()

$("select:visible").filter(function() {
  return $(this).find('option').length == 4;
}).css('color', 'red')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
</select>

Answer 2

你的代码也是正确的只有问题是你需要用一些元素包装你的select元素才能使$ .find函数工作。例如

//Going to add a div to wrap all elememts    
var myDiv = $("<div><select><option>1</option><option>2</option><option>3</option></select><select><option>1</option><option>2</option><option>3</option><option>4</option></select><select><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select><div>");
$.grep(myDiv.find("select"),(el)=>$(el).find("option").length===4);

查找具有4个选项的所有可见选择

2 个答案: