需要通过HREF链接只有一个手风琴面板，并保持折叠功能

问题描述：

这里的功能的小提琴，我想的是：需要通过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;如何在点击任意一个手风琴组锚时保持折叠功能，同时能够在第一个手风琴面板上进行外部链接？

答

您可以同时使用data-target和href ...

只需使用data-target=""的崩溃行为，并href=".."为外部头塌陷链接。

<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

需要通过HREF链接只有一个手风琴面板，并保持折叠功能

相关推荐