Verwenden Sie jQuery, um zu überprüfen, ob alle divs ausgeblendet sind.

Question

Wie würde ich prüfen, ob alle divs mit class test ausgeblendet sind. Und wenn sie alle versteckt sind, setze wrap1 auf hidden. Vielen Dank.

<div id='wrap1'> 
<div class="header">Header 1</div> 
<div class='test'><a href="#">Test 1</a></div> 
<div class='test'><a href="#">Test 2</a></div> 
<div class='test'><a href="#">Test 3</a></div> 
</div> 

UPDATE: Danke an alle für die wirklich schnelle Antworten, ich habe es funktioniert. Sie waren alle sehr hilfsbereit.

Answer 1

können Sie tun, um die Prüfung, durch den Wähler, wie oben und es wie folgt vorgeschlagen:

if ($("div.test:visible").length === 0) 
     $("#wrap1").hide(); 

Answer 2

Bessere Art und Weise zu sehen, ob sie alle sichtbar sind, ist die Anzahl für Sichtbarkeit die gleiche wie die Gesamtzahl.

$("#wrap1 div:visible").length == $("#wrap1 div").length 

Answer 3

Dieser Code-Schnipsel in einer Schleife alle <div id="wrap#"> und sie verstecken, wenn der Test versteckt sind.

$("div[id^='wrap']").each(function() { 
    var wrap = $(this); 

    if(wrap.children("div[class^='test']:visible").length == 0) { 
    wrap.hide(); 
    } else { 
    wrap.show(); 
    } 
}); 

Wenn Sie noch Ihre <div id="wrap#"> sichtbar halten wollen, wenn es keinen Test überhaupt sind (wie in keiner im Markup), können Sie das folgende modifizierte Schnipsel verwenden:

$("div[id^='wrap']").each(function() { 
    var wrap = $(this); 

    if(wrap.children("div[class^='test']").length > 0 && 
    wrap.children("div[class^='test']:visible").length == 0) { 
    wrap.hide(); 
    } else { 
    wrap.show(); 
    } 
}); 

Es gibt keine zwingender Grund, Klassen zu nummerieren (außer in Randfällen). Ihre Nummerierung verkompliziert den obigen Code sowie Ihr CSS. Es wäre einfacher, einfach die Nummerierung von test zu entfernen. (Sie brauchen es nicht, wie Sie immer eine Teilmenge von ihnen mit :lt(index) auswählen können, :gt(index), :eq(index), :first und :last.

Wie für die Nummerierung ids, das ist in Ordnung, da jede ID muss eindeutig sein.

Answer 4

jQuery("#wrap1").find("div").each(function() 
    { 
     if ($(this).is(':hidden')) 
     { 
     } 
    } 
);