Bootstrap Collapse не переключается после показа, скрытия или переключения из кода

Мой HTML это:

<div id="accordion-container">
    <div class="accordion" id="navaccordion">
        <div class="accordion-group">
            <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#navaccordion" href="#collapseMenu">
                    <strong>My Menus</strong>
                </a>
            </div>
            <div id="collapseMenu" class="accordion-body collapse in">
                <div class="accordion-inner">
                    <div class="navigation" id="navigationcontainer">
                        <span id="menutree">
                            MenuTree
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="accordion-group">
            <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#navaccordion" href="#collapseQuickLinks">
                    <strong>Quick Links</strong>
                </a>
            </div>
            <div id="collapseQuickLinks" class="accordion-body collapse">
                <div class="accordion-inner">
                    <div class="quicklinks" id="quicklinkscontainer">
                        <span id="quicklinkslist">
                            QuickLinks
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="accordion-group">
            <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#navaccordion" href="#collapseQueue">
                    <strong>Queue</strong>
                </a>
            </div>
            <div id="collapseQueue" class="accordion-body collapse">
                <div class="accordion-inner">
                    <div class="queue" id="queuecontainer">
                        <span id="queuetree">
                            Queue
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Мой пример здесь:http://jsfiddle.net/pdavis68/Xut4C/2/

Если вы удалите код JavaScript, вы заметите, что переключение коллапса работает правильно. Если вы нажмете «Быстрые ссылки», «Мои меню» закроются и откроются «Быстрые ссылки».

Если вы оставите JS внутри, вы заметите, что открытие «Моих меню» или «Быстрых ссылок» не приведет к сбою чего-либо еще, но если вы откроете «Очередь», это все равно приведет к сбою других.

Кажется, не имеет значения, если я использую команду «toggle», «show» или «hide» в свертке, это нарушит функциональность переключения.

Кроме того, в примере, что должно произойти (по крайней мере, по моим расчетам), это то, что «Мои меню» должны закрываться (что происходит), а затем «Быстрые ссылки» должны открываться (что НЕ делает. )

Итак, 2 вопроса:

Как программно показать / скрыть группы, не нарушая функциональность переключения?

Как мне открыть вещи?

Ответы на вопрос(3)

олистал эту часть, когда читал документацию, и это меня очень озадачило.

$('#myCollapsible').collapse({
    toggle: false
})

После активации вы можете скрыть и показать его как обычно.

$('#myCollapsible').collapse('hide');
$('#myCollapsible').collapse('show');

http://getbootstrap.com/javascript/#collapse-methods

1. Попробуйте использоватьcollapse() с вариантами,'parent' это важно

$("#collapseMenu").collapse({"toggle": true, 'parent': '#navaccordion'});
$("#collapseQuickLinks").collapse({"toggle": true, 'parent': '#navaccordion' });

Скрипки:http://jsfiddle.net/hieuh25/Xut4C/6/

2. В основном у вас есть 2 способа:

Добавить классin к этому div, например:<div id="collapseMenu" class="accordion-body collapse in"> вызвать этот div, чтобы открыть.

использованиеcollapse() с опцией'toggle': true как указано выше, когда div закрыт.

Надеюсь, это поможет.

data-parent="#navaccordion" в<div id="collapseMenu" class="accordion-body collapse" data-parent="#navaccordion"> и звоните без дополнительного ключа'parent' любить.collapse({"toggle": true});

ВАШ ОТВЕТ НА ВОПРОС