Bootstrap3下拉菜单切换折叠div

Question

我试图让Bootstrap3导航下拉列表触发可折叠的div，同时显示下拉列表 - 基本上是为了模拟＆＃39;一个全宽的子空栏：

$('.dropdown').on('show.bs.dropdown', function () {
    $('#collapseExample').slideDown('normal');
});
$('.dropdown').on('hidden.bs.dropdown', function () {
    if (!$('div.dropdown').hasClass('open')) {
        $('#collapseExample').slideUp('normal');
    }
});

http://codepen.io/anon/pen/myRgbQ

我几乎已经开始工作但是当已经有一个subnav打开时它表现得很奇怪......

我确定这是一个快速修复，但我很难过！任何帮助将不胜感激！

Answer 1

试试这段代码：

$('#collapseExample').collapse(true);   
$('.dropdown').on('show.bs.dropdown', function () {
        $('#collapseExample').slideDown('normal');
  $(this).find('.dropdown-menu').first().stop(true, true).slideDown();
    });
    $('.dropdown').on('hidden.bs.dropdown', function () {
        if (!$('div.dropdown').hasClass('open')) {
            $('#collapseExample').slideUp('normal');
      $(this).find('.dropdown-menu').first().stop(true, true).slideUp();
        }
    });