2017-03-07 3 views
0

を維持する必要があります。そのうちの2つにはサブメニューが含まれていますが、そのうちの1つには何も表示されず、代わりにclick(hrefを使用)のリンクがあります。は、ここで私が好きな機能のフィドルのhrefを通じて唯一のアコーディオンパネルをリンクし、折りたたみ機能

最初のアコーデオングループでhrefを試してみると、クリックするとすべてのパネルを折りたたむことができなくなります。それだけではもう機能しません。

<div> 
<div id="accordion"> <!-- accordion 1 --> 
    <div class="panel"> 
    <a data-toggle="collapse" data-parent="#accordion" href="#accordionOne"> 
     Need this to link outside 
    </a> 
    <div id="accordionOne"> 
    </div> 
    </div> 

    <div class="panel"> <!-- accordion 2 --> 
    <a data-toggle="collapse" data-parent="#accordion" href="#accordionTwo"> 
     Collapsible Accordion 2 
    </a> 
    <div id="accordionTwo" class="collapse"> 
     <div class="panel-body"> 
     Change does not roll in on the wheels of inevitability, 
     but comes through continuous struggle. 
     And so we must straighten our backs and work for 
     our freedom. A man can't ride you unless your back is bent. 
     </div> 
    </div> 
    </div> 

    <div class="panel"> <!-- accordion 3 --> 
     <a data-toggle="collapse" data-parent="#accordion" href="#accordionThree"> 
     Collapsible Accordion 3 
     </a> 

     <div id="accordionThree" class="collapse"> 
     <!-- panel body --> 
     <div class="panel-body"> 
      You must take personal responsibility. 
      You cannot change the circumstances, 
      the seasons, or the wind, but you can change yourself. 
      That is something you have charge of. 
     </div> 

     </div> 
</div> 
</div> 

TLDR。どのアコーデオングループアンカーをクリックしても、最初のアコーディオンパネルの外部にリンクすることができますが、折りたたみ機能はどのように維持できますか?

答えて

0

あなただけの最初の崩壊のリンクで外部のために崩壊行動のdata-target=""、およびhref=".."を使用data-targethref ...

の両方を使用することができます。

<a data-toggle="collapse" data-parent="#accordion" data-target="#accordionOne" href="/"> 
     Need this to link to another page (but collapse any currently open submenus) 
</a> 

Codeply Demo

関連する問題