Javascript 如何动态统计div显示块？

我有3个分区。默认情况下，分区2是隐藏的。 通过单击“添加”或“删除”链接，我希望显示或隐藏另一个div。然后，我想动态计算显示的div

这是我的HTML：

<div id="clone1" class="billet">
    <input type="text" /><span id="test"></span>
</div>

<div id="clone2" class="billet" >
    <input type="text" />
</div>

<div id="clone3" class="billet" >
    <input type="text" />
</div>

<div id="ajout-suppr">
    <a href="javascript:;" class="ajoutBillet" >Ajouter un billet</a>
    <span>-------------</span>
    <a href="javascript:;" class="supprBillet" >Supprimer un billet</a>
</div>

-------------

jQuery：

$(document).ready(function () {

    $(".supprBillet").hide();
    $("#clone2").hide();
    $("#clone3").hide();


    $(".ajoutBillet").click(function (){
        var nb = $('.billet:not([style*="display: none"])').size();
        $('#test').html(nb);
        if(nb < 2) {
            $(".supprBillet").hide();
        }
        else {
            $(".supprBillet").show("slow");
        }

        if($("#clone2").hide()) {
            $("#clone2").show("slow");
        }

        if($("#clone3").hide() && $("#clone2").show()) {
            $("#clone3").show();
        }

        if($("#clone3").show() && $("#clone2").show()) {
            $(".ajoutBillet").hide("slow");
        }
    }); // fin du click function ajout billet


        $(".supprBillet").click(function (){
            var nb = $('.billet:not([style*="display: none"])').size();

            if(nb < 2) {
                $(".supprBillet").hide();
            }
            else {
                $(".supprBillet").show();
            }

            if($("#clone2").show() && $("#clone3").hide()) {
                $("#clone2").hide();
            }

    }); // fin du click function suppr billet


});

$（文档）.ready（函数（）{
$（“.supperbillet”）.hide（）；
$（“#克隆2”）.hide（）；
$（“#克隆3”）.hide（）；
$（“.ajoutsbrame”）。单击（函数（）{
var nb=$（'.square:not（[style*=“display:none”]））.size（）；
$（'#test'）.html（nb）；
如果（nb<2）{
$（“.supperbillet”）.hide（）；
}
否则{
$（“.supperbillet”）.show（“slow”）；
}
if（$（“#克隆2”）.hide（））{
$（“#clone2”）.show（“slow”）；
}
if（$（“#克隆3”）.hide（）&&（$（“#克隆2”）.show（））{
$（“#克隆3”）.show（）；
}
如果（$（“#克隆3”）.show（）&&（$（“#克隆2”）.show（））{
$（“.ajoutblame”）.hide（“慢”）；
}
})；//fin du click函数
$（“.supperbillet”）。单击（函数（）{
var nb=$（'.square:not（[style*=“display:none”]））.size（）；
如果（nb<2）{
$（“.supperbillet”）.hide（）；
}
否则{
$（“.supperbillet”）.show（）；
}
if（$（“#克隆2”）.show（）&&（$（“#克隆3”）.hide（））{
$（“#克隆2”）.hide（）；
}
})；//fin du click函数支持
});

正如你所看到的，没有什么是有效的。 你能给我看一个问题吗？ 提前感谢。

您可以尝试以下方法：
you can try something like this:    

jQuery('.ajoutBillet').on('click',function(){

        var lengthDivs = jQuery('.billet:visible').length;
        if(lengthDivs < 2 && jQuery('.supprBillet:visible').length > 0){
            jQuery('.supprBillet').hide();
        }
    });

jQuery（'.ajoutblame'）。在（'click'，function（）上{
var lengthDivs=jQuery（'.square:visible'）.length；
if（lengthDivs<2&&jQuery（'.supperbillet:visible'）。长度>0）{
jQuery（'.supperbillet'）.hide（）；
}
});

我把它做成了一个。这似乎做了（代码）所期望的事情。您正在引用jquery库吗

我通过检查1对你的计数做了一些更改

if(nb < 1) {
    $(".supprBillet").hide();
}

if（nb<1）{
$（“.supperbillet”）.hide（）；
}

现在显示并隐藏输入：

$（文档）.ready（函数（）{
$（“.bump输入：第n个子项（1）”）.hide（）；
$（“.bump输入：第n个子项（2）”）.hide（）；
$（“#新建”）。单击（函数（）{
var计数=0；
$（“.input”）.each（函数（）{
如果（$（this）.is（“：可见”））{
计数++；
}
});
$（“.bump输入：第n个子项（“+count+”）.show（）；
if（$（“#总divs”）.html（）<3）{
$（“#总divs”）.html（计数+1）；
}
});
$（“#删除”）。单击（函数（）{
var计数=-1；
$（“.input”）.each（函数（）{
如果（$（this）.is（“：可见”））{
计数++；
}
});
如果（计数>0）{
$（“.bump输入：第n个子项（“+count+”）.hide（）；
$（“#总divs”）.html（计数）；
}
});
});
输入{
保证金：4px0；
宽度：100%；
}
.行动{
显示：块；
文本对齐：居中；
}

| 
总计：1
您需要通过jquery.is（“：visible”）函数检查可见div。
这样说：

替换这个

var nb = $('.billet:not([style*="display: none"])').size();

与

var nb = $('.billet').is(":visible").length;