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

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

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

Answer 2

对于样式，我建议使用带有函数参数的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;
}

Jquery：过滤功能

2 个答案: