无法在Jquery中执行show（）方法

Question

我有类似的东西：

<div id="id1">
    //some code 1

    <div id = "id2">
    //some code 2

    </div>
</div>

现在，我使用以下命令隐藏所有块：

$("#id1").hide();

但是，当我试图用命令显示内部块时：

$("#id2").show();    

但这不起作用！

我该怎么做才能解决这个问题？

Answer 1

当父元素隐藏时，其所有子元素也隐藏。

如果您只想显示带有“id2”ID的元素，可以这样做：

$('#id1').children(':not(#id2)').hide();  //Hiding all children except '#id2'  
$('#id1').show();

Answer 2

如果id1被隐藏，id2是否可见并不重要。它不会显示，因为它的父级是隐藏的。所有后代元素都是如此。

Answer 3

使用display:none （这是.hide()所做的）是不可能的。 display:none隐藏元素，因此不会显示任何子元素。

如果您可以从使用display切换到visibility，这可能与您想要的一致。

#id1 {visibility: hidden;}
#id2 {visibility: visible;}

查看工作小提琴：http://jsfiddle.net/vLYnk/2/

使用javascript，您可以使用：

$("#id1").css('visibility', 'hidden');
$("#id2").css('visibility', 'visible');

Answer 4

创建一个元素并将其复制然后显示它。

var element = jQuery('#id2').clone();
element.appendTo('some element');

Answer 5

如果要显示内部div，则需要移动内部div。像

这样的东西

$("#id2").parents(":visible").appendTo($("#id2"))