复选框选择/取消选中fadein / fadeout div

Question

当我选择任何一个复选框时，我试图调出一个菜单，如下面的屏幕截图所示，它显示了选择的数量，当没有选择时菜单也会消失。

我可以使用此代码调出菜单

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

但是，我不知道在取消选中复选框时如何隐藏它以及如何计算选择次数。

谢谢。

Answer 1

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

计算选中的复选框

$("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();
   }
});

Answer 2

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

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

所以..

$("input[type='checkbox']").click(function(){
  if ($("input[type='checkbox']:checked").length < 1)
    $("#menu").hide();
});

Answer 3

$("input[name='id[]']").focus(function(){
   if ($(this).is(':checked')){
     $("#menu").fadeIn();
    }else{
     $("#menu").fadeOut();
    }
});

这应该做你需要的，

修改

你的选择器似乎不太好看。你应该让它更具体。 例如：

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

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

这将包括所有输入字段，其名称以'id ['和'\'开头，这是为了转义'['。

希望它有所帮助，思南。