Javascript 切换类后将高度设置回0

我有下面的HTML和JS。当您单击

.slidedown开关时，它会在其父级（
.slidedown
）上切换类“打开”，并将高度应用于其同级（
.nav sub
）。这是可行的，但当“打开”类不存在时，将高度设置回0是不可行的。我错过了什么

HTML

<li class="slidedown">
  <a href="#">Parent Link</a>
  <!-- Dropdown arrow -->
  <span class="slidedown-toggle">
    <span class="caret"></span>
  </span>
  <!-- Submenu -->
  <ul class="nav nav-sub">
    <li>
      <a href="#">Child Menu Item 1</a>
    </li>
  </ul>
</li>

$（'#global nav li.open'）
将返回一个始终真实的jQuery对象，您需要检查当前toggle元素所属的
li
是否打开了类

您可以使用.closest（）查找
li
元素，然后使用.hasClass（）检查该类是否存在

$(function navCollapse() {

    var slidedownToggle = $('#global-nav .slidedown-toggle');

    slidedownToggle.click(function () {
        var slidedown = $(this).parent('.slidedown');
        var $li = $(this).closest('li');
        var subnav = $(this).siblings('.nav-sub');
        var subnavHeight = subnav.height();

        slidedown.toggleClass('open');

        if ($li.hasClass('open')) {
            subnav.height(0);
        } else {
            subnav.height(subnavHeight);
        }

    });

});


  var $gNav = ('#global-nav');

  $('.slidedown-toggle', $gNav).click( function( e ) { 

    var myLI = $(this).closest('.slidedown');
    var isON = myLI.hasClass('open');

    // ALL
    $('li.open', $gNav).removeClass('open').find('.nav-sub').slideUp();

    // THIS
    myLI.toggleClass('open', !isON).find('.nav-sub').stop().slideToggle();  

  });

这不是问题所问的吗？我不想通过JS制作任何动画，这就是我计算高度的原因。@davidpauljunior什么的高度<代码>subnav=$（this）.sibbines（'.nav sub'）所有
.subnav元素
？为什么？我想要“.nav sub”的高度，它是已单击的滑动向下切换的同级。我想要它，这样我就可以用CSS转换它。我的退路是使用最大高度，但我不想猜测最长列表的最大高度。但我刚刚意识到为什么这行不通，因为使用JS计算高度，并在CSS中将其设置为0。回到原点。@davidpauljunior CSS是我们在你的问题中遗漏的唯一一件事，也许可以帮助你找到一些东西。也许你在一个扩展的演示中向我们展示你所做的一切永远不会晚，谢谢。我刚刚意识到：a）如果我在CSS中将高度设置为0，那么这个脚本将计算高度为0。b） 脚本在第二次单击时将高度设置为0后，从那时起，它将只计算为0。也许回到绘图板上来。
  var $gNav = ('#global-nav');

  $('.slidedown-toggle', $gNav).click( function( e ) { 

    var myLI = $(this).closest('.slidedown');
    var isON = myLI.hasClass('open');

    // ALL
    $('li.open', $gNav).removeClass('open').find('.nav-sub').slideUp();

    // THIS
    myLI.toggleClass('open', !isON).find('.nav-sub').stop().slideToggle();  

  });