21

私の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 をそのままにしておくと、[マイ メニュー] や [クイック リンク] を開いたときに他が折りたたまれることはありませんが、[キュー] を開くと、他のものが折りたたまれます。

折りたたみで「トグル」、「表示」、または「非表示」コマンドを使用しても問題ないようです。トグル機能が壊れます。

また、この例では、（少なくとも私の推測では）「マイメニュー」が閉じて（実際にそうです）、「クイックリンク」が開いて（そうではありません）する必要があります。 )

だから、2つの質問：

  1. トグル機能を壊さずにプログラムでグループを表示/非表示にするにはどうすればよいですか?

  2. どうすれば開くことができますか?

4

3 に答える 3

3

次のような追加のキーなしで追加data-parent="#navaccordion"し<div id="collapseMenu" class="accordion-body collapse" data-parent="#navaccordion">て呼び出すこともできます'parent'.collapse({"toggle": true});

于 2014-01-17T20:55:20.817 に答える