Jquery：过滤功能

Question

我使用过滤器功能浏览了一个类列表。如果下拉列表为空，则添加错误样式。

问题。 如果满足条件，我想隐藏并显示其他 div id，即如果所有下拉列表都包含选定的值

这是我为空下拉菜单添加样式的代码

 $(".dropdown_select").filter(function(){
 return $(this).val() == "";
 }).css("border-color", "#FF0000");

但是我该如何隐藏和显示另外两个 div id？即只有当所有下拉菜单都被填满时，我才愿意

$(".step-2").fadeIn("slow");
$(".step-1").fadeOut("slow");

Answer 1

对于样式，我建议使用带有函数参数的toggleClass()，而不是filter() 和css()：

$(document).on("change", ".dropdown_select", function () {
  var $emptyOnes = $(".dropdown_select")
                   .filter(function () { return this.value == ""; });

  if ($emptyOnes.length == 0) {
    $(".step-1").fadeOut("slow");
    $(".step-2").fadeIn("slow");
  } 

  $(this).toggleClass("empty", this.value == "");
});

tre CSS 定义如下：

.empty {
  border-color: #FF0000;
}

Answer 2

var $children = $(".dropdown_select").children();

if($children.length === $children.filter(".dropdown_select").length) {
   $(".step-2").fadeIn("slow");
   $(".step-1").fadeOut("slow");
}