好的，我有一种情况需要将一些克隆的DOM元素添加到网页中的父DIV元素。
我有四个父DIV持有人。当我将其可见性从可见切换到隐藏时，会发生一些非常奇怪的事情：所有后期页面加载的子项都保持可见！
这是下载源代码的链接： http://www.clarencebowman.com/parent-child-visibility/parent-child-visibility.zip
这里是第一手查看现象的链接： http://www.clarencebowman.com/parent-child-visibility
您将看到的是一个红色方框，其中添加了一些洋红色子元素，页面加载后。页面底部有一个显示/隐藏按钮。
我在父DIV中添加了一个绿色条纹，以显示其子元素确实正确地继承了它的可见性。
但是在添加克隆的子元素然后隐藏父DIV之后，克隆的子元素中的NONE就会消失！
在运行复制脚本之前，我已经尝试将要克隆的子项放在父DIV中...这没什么区别。
在页面加载后添加的任何子元素似乎都以某种方式丢失了与父DIV元素（红色框）的继承链接......
其他人有此体验吗？是否有一种简单的方法来修复/替换/重新分配孩子的继承？
我正在使用jQuery 1.5。
答案 0 :(得分：27)
您没有在父级上使用display: none（这会影响孩子），您在父级上使用visibility: none，而在子级中使用visibility: visible css属性。如果您希望孩子隐藏，也可以将其设置为visible: hidden，或者在父元素上使用display: none。
因此，正如Kyle指出的那样，您可以使用$('#parent_div').toggle();，这样可以轻松地将display: none应用于#parent_div。
我只想补充说visibility和display不一样。例如，如果元素为width: 10px，height: 10px，则visibility会保留元素的维度空间（它仍然占用width: 10px，height: 10px），而{display: none 1}}从父元素（width: 0，height: 0）中完全删除元素的维度。 Visibility意味着它仍然在视觉上以流动方式表示与其他受影响的元素相关，它只是没有看到; display表示屏幕上没有显示与其他显示/可见元素相关的信息。
答案 1 :(得分：24)
许多其他人提到只使用display: none，但正如您所知，这与使用visibility属性完全不同。
您可以做的一件事是使用hidden / inherit代替hidden / visible。 inherit默认情况下会导致元素可见，除非其中一个元素不可见。这就是你想要的。
答案 2 :(得分：2)
在某些情况下，您无法使用此处建议的两种解决方案。
E.g。
display: none将无效，因为元素在隐藏时需要知道它的宽度和高度。
如果您无法控制孩子，并且无法向他们添加visibility: hidden，则visiblity:inherit可能无效。
在这些情况下，您可以使用例如opacity: 0添加z-index:-1以隐藏元素（只记得它们仍然存在且可点击等）。
答案 3 :(得分：0)
从子项中删除visibility：visible属性。这将解决您的问题。您可以在父级上使用.hide（）和.show（）（或.toggle（）），而不是将显示设置为none而不是隐藏。