jQuery具有动态内容的等分高度

我正在尝试实现高度相等的列，其中一列包含扩展菜单

我几乎让它工作使用下面的代码基于。可以看到和上的柱高度相等

唯一的问题是，在后一页和任何其他短页上，内容下方有一个空格。计算的高度是否包括隐藏的子菜单？如果是这样，我可以停止它这样做，还是我需要使用不同的代码

提前感谢您的指导

简化的HTML：

<div id="body-container">
<div id="primary-menu">
  <div class="menu">
  <ul>
  <li>Menu item</li>
  <li>Menu item</li>
  <li>Menu item
    <ul class="sub-menu" style="float: none; display: none; visibility: hidden;">
    <li>Submenu item</li>
    <li>Submenu item</li>
  </li>
  </ul>
  </div>
</div>
<div id="container">
Main content
</div>
</div>

---

尝试使用Visibly:collapse而不是Visibly:hidden。。。。因为“隐藏”隐藏了内容，但它计算了内容的空间。。。但是折叠隐藏了内容和空间

不久前我也有过类似的问题。看看它。谢谢Dejan，但它的工作原理与我问题中的代码相同。也就是说，它似乎在计算中包含了隐藏的菜单，因此在主页和其他较短的页面上留下了很大的空白。感谢lakshimi，但显而易见：崩溃似乎并没有为我隐藏空间Firefox和Chrome for mac它在Chrome中不起作用。。但我认为它会对ff起作用。。。好的，再次感谢lakshmi，但我真的希望它也能在Chrome中工作。加这不应该只用于表元素吗？你是对的。。。只有在表中使用时，它才起到折叠的作用。。。在其他地方，塌陷只起到隐藏的作用。。。你有没有在不可见的情况下尝试此代码。。。喜欢这边

jQuery(document).ready( function(){
    function equalHeight(){
        var heightArray = jQuery("#body-container>div").map( function(){
                 return  jQuery(this).height();
                 }).get();
        var maxHeight = Math.max.apply( Math, heightArray);
        jQuery("#container").height(maxHeight);
        jQuery("#primary-menu").height(maxHeight);
            }
    equalHeight();
});