如何当另一个div中的所有div都看不见

Question

我有我的HTML作为

<div id="main"> 
    <div class="item">String</div> 
    <div class="item">String</div> 
    <div class="item">String</div> 
</div> 

点击每个.item DIV设置DIV单击以display: none检测。如果没有显示div，我希望#main div也设置为display :none。

那么如何检测出#main div中的所有div .items都处于使用jQuery的“display：none”模式？

$(document).ready(function() { 
    $('.item').click(function(){ 
     $(this).hide(); 
    }); 
}); 

Answer 1

使用:visible选择：

if (! $('#main > div:visible').length) { 
    $('#main').hide(); 
} 

Answer 2

你也可以做以下

if(!$('.item').is(':visible')) 
    $('#main').hide();  

下面是一个工作示例：http://jsfiddle.net/mwGeT/