4

私のページの左側に、単純なtwtterブートストラップ折りたたみアイテムのセットアップだと思ったものがあります：http： //papershare.ravennainteractive.com/single-item.html

1つのアコーディオンヘッダーをクリックすると開きますが、別のアコーディオンヘッダーをクリックすると、最初のアコーディオンヘッダーを閉じて2番目のアコーディオンヘッダーを開くのではなく、そのアコーディオンヘッダーも開きます。

サイトを最新のブートストラップjsおよびcssにアップグレードしました。

別のものを開いたときに開いているものを閉じるにはどうすればよいですか？

ありがとう

4

3 に答える 3

5

構造は（擬似コードで）する必要があります

< class="accordion" id="myAccordion">
    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion">
        < class="accordion-body">

    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion">
        < class="accordion-body">

ここで、accordion-groupは個別に折りたたまれる個別のパーツを表します。アコーディオングループを切り替えるリンクのdata-parentクラスは、同じ親の他のアコーディオングループを閉じる必要があることを決定するために使用されます。

于 2012-08-31T18:58:19.747 に答える
1

ブートストラップ折りたたみドキュメントに従ってHTMLマークアップを作成した場合は、このコピー/貼り付けの単純なjqueryコードを使用してこれを実現できます。

$(document).on('click', '.accordion-toggle', function(e) {
            event.preventDefault();

            $('#accordion').find('.accordion-body').collapse('hide');
            $(this).parent().next().collapse('show');
        });
于 2013-10-28T09:58:00.510 に答える
0

私は同様の問題で立ち往生していましたが、データ親オプションは最初は機能しませんでした。

私の問題は、同じID#accordionを参照する2つのパネルグループがページにあることでした。解決策は、各グループに一意のIDを与えることでした

<!-- Accordion 1 -->
< class="accordion" id="myAccordion">
    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion">
        < class="accordion-body">

    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion">
        < class="accordion-body">

<!-- Accordion 2 -->
< class="accordion" id="myAccordion-2">
    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion-2">
        < class="accordion-body">

    < class="accordion-group">
        < class="accordion-header">
            <a data-parent="#myAccordion-2">
        < class="accordion-body">

振り返ってみるとかなり明白です;-)

于 2014-08-11T08:37:52.203 に答える