jQuery Hide（）和Show（）不能正常工作-非常沮丧

Question

我有一些这样的HTML

<div id="topContainer">
 <div id="level1" style="display:none;"> </div>
 <div id="level2" style="display:none;"></div>
</div>

我可以检索level1和level2，并在它们上成功调用show（）和hide（）。但是，具有style =“ display：none;”然后调用jQuery（“＃topContainer”）。show（）做nada。 ：（

可能有什么问题吗？

下面的JS

//LOGIC HERE THAT SHOWS LEVEL1 and LEVEL2 based on business logic

//If neither div is shown (got a variable set to false, it set to true each time
//the business logic shows the div
//if variable is still false, then the below line runs
jQuery("#topContainer").hide()

已尽我所能更新了代码。

Answer 1

.show()和.show()在父母上不会影响孩子，如果他们被隐藏，他们会保持隐藏...他们将独立处理。

但是，如果需要，您也可以在子级上调用.hide()，例如：

.hide()

Answer 2

我想知道隐藏.show()的逻辑是否引起了问题。我在这里设置了一个演示来显示.show()选择器的实用程序。但是为了使一个元素被认为是空的，它甚至不能包含单个空格（文本节点）。

使用您提供的HTML。我已经设置了jQuery("#topContainer").show().children().show(); ...在div中添加内容，然后重新运行脚本，您可以看到区别。

#topContainer

Answer 3

:empty工作吗？

:empty工作吗？

您是否使用Firebug或其他可以显示实际DOM属性前后的DOM属性以及规则级联。

[我怀疑是demo here正在通过其他方式设置

var container = $('#topContainer'),
    divs = container.find('div'),
    empty = divs.filter(':empty');

if (divs.length == empty.length) {
    // hide container!
    $('#topContainer').hide();
    alert('hidden!');
} else {
    // don't do anything
    alert("don't hide!");
}

，或者另外一个div在页面下方带有＃topContainer`（这将是无效的HTML）。

Answer 4

我的问题有所不同，但情况有所不同

脚本已放置在DOM创建要隐藏的元素之前。

我将脚本更改为“页面加载后”

$("#topContainer").css("display", "block");