代码之家 › 专栏 › 技术社区 › Brian Johnson

如何隐藏jquery中只包含隐藏div的元素?

jquery javascript

Brian Johnson · 技术社区 · 15 年前

我想隐藏所有只包含隐藏分隔符的块(除了标题)。必须通过类名选择所有元素。

详细地说,我希望每个“eventBlock”在下面的所有“groupBlock”都已隐藏时不显示。与“菜单”相同,在隐藏所有子事件块时不应显示该菜单。

每个“菜单”包含多个事件块,

每个“EventBlock”包含一个或多个GroupBlock。

我正在使用类,不能使用ID,因为有很多GroupBlock、EventBlocks等。

如果相关的话,可以使用jquery的“hide()”函数隐藏div。

我的HTML基本上是这样的:

<div class="Menu">
     <strong><a name="one">Menu CAPTION</a></strong><br />
     <div class="eventBlock event1">
         <p class="underlined">eventBlock CAPTION</p>
         <div class="groupBlock group2">
             <strong>name</strong><br />
             4pm - 6pm<br />
         </div>
         <div class="groupBlock group1">
             <strong>name</strong><br />
             5pm - 7pm<br />
         </div>
     </div>
</div>

3 回复 | 直到 15 年前

Scott Evernden 15 年前

$('eventBlock').each(function() {
    if ($('.groupBlock:visible', this).length)
        $(this).show();
    else
        $(this).hide();
});

可以作为插件实现

james 15 年前

这应该有效:

var blocks = jQuery(".groupBlock");
if( blocks.size() == blocks.not(":visible").size() )
{
  blocks.parents(".eventBlock").hide();
}

如果所有分组块都隐藏,则可以执行类似的操作来隐藏菜单。

Kobi 15 年前

最简单的方法是使用单个jquery选择器:

$('.eventBlock:not(:has(.groupBlock:visible))').hide();

就个人而言,我发现 not() 功能更可读,我可以使用 end() 后来:

$('.eventBlock').not(':has(.groupBlock:visible)').hide();

现在,你想隐藏 Menu S也是吗?如果菜单没有可见的事件块,那么它似乎应该是隐藏的,这意味着它没有可见的分组块。因此,我们可以使用与以前相同的条件:

$('.eventBlock, .Menu').not(':has(.groupBlock:visible)').hide();

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前

SlickRed · 我无法使用JS关注HTML元素

1 年前

Mayron Guedes · 如果登录名不在本地存储中,如何重定向页面?

1 年前

assembler · Nextjs没有处理发布请求

1 年前

PavelB · 如何使用Seleniumwebdriver和mocha只运行一个测试文件?

1 年前

BADRUM · 执行两个获取功能后,如何导航回页面?

1 年前

Toniq · javascript为php保存多维数组

1 年前

Natalie Smyth · 隐藏类只在我试图切换的两个部分中的一个部分上工作

1 年前

SkyWalker · 在JavaScript中,合并日期-时间序列的有效算法是什么?

1 年前