Question

我正在尝试隐藏一个h3标签，当兄弟div的孩子全部显示：无。但是，当只有sibling div不可见时，即使div的子项可见，jquery也会隐藏我的h3标记。想法？

链接到JSFiddle：https://jsfiddle.net/00ofvxor/

HTML：

<h3 class="EventsContainer">H3</h3>
<div class="EventsContainer" style="display:none;">
    <ul>
        <li class="StatusContainer" style="display:none;">LI1</li>
        <li class="StatusContainer" style="display:none;">LI2</li>
        <li class="StatusContainer">LI3</li>
    </ul>
</div>

jquery的：

$(document).ready(function(){
    $('div.EventsContainer').css('display',function(){
        var children = $(this).find('li.StatusContainer');
        if (children.length === children.not(':visible').length)
        {
            $(this).prev().css('display', 'none');
            return 'none';
        }
        else
        {
            return 'block';
        }
    });
});

Answer 1

您需要检查display值。映射children并返回display:none：

...
var children = $(this).find('li.StatusContainer');
var hiddenChildren = children.map(function() { 
    if ($(this).css('display') === 'none')
        return $(this)
});
if (children.length === hiddenChildren.length) { 
    ...
}
...

哪个应该能满足您的需求。

请参阅Fiddle

Jquery应该在显示时隐藏容器

1 个答案: