Javascript fadein/fadeout div on复选框选择/取消选择

我试图在选中任何一个复选框时打开一个菜单，正如您在下面的屏幕截图中所看到的，它显示了选择的数量，并且当未选中任何复选框时，菜单也会消失

我可以用这个代码打开菜单

$("input[name='id[]']").focus(function(){
    $("#menu").fadeIn();
});

但是，我不知道在未选中复选框时如何隐藏它，以及如何计算选择的数量

---

谢谢。

要计算您可以使用的选项数：

$("input[type='checkbox']:checked").length;

所以

$（“输入[type='checkbox']）。单击（函数（）{
如果（$（“输入[type='checkbox']：选中”）。长度<1）
$（“#菜单”）.hide（）；
});

这应该能满足你的需要

编辑：

但是，您的选择器似乎不正常。你应该更具体一些。 例如：

如果它以id[开头，您可以这样做：

$("input[name^=id\\[]")

这将包括所有输入字段，它们的名称以“id[”和“\”开头，这用于转义此“[”

---

希南，希望有帮助。

当您选中复选框时，将触发焦点或单击事件。您可以使用

$("input:checked").length;

如果您使用该数字隐藏菜单，则应该可以：

$("input[name='id[]']").click(function(){
   if($("input:checked").length > 0) { //checked boxes?
      if($("#menu:visible").length == 0) { //menu not visible?
          $("#menu").fadeIn();
      }
   } else {
      $("#menu").fadeOut();
   }
});

$("input:checked").length;

$("input[name='id[]']").click(function(){
   if($("input:checked").length > 0) { //checked boxes?
      if($("#menu:visible").length == 0) { //menu not visible?
          $("#menu").fadeIn();
      }
   } else {
      $("#menu").fadeOut();
   }
});