簡體   English   中英

折疊/展開按鈕上的折疊單擊

[英]Collapse/Expand Accordion on Button Click

之前我問過這個問題,但我不清楚我的問題,我想在點擊按鈕時折疊手風琴的一部分,該按鈕禁用當前部分並擴展手風琴的下一部分https://jsfiddle.net/ 2L1x9v07 /

Collapse current accordion section disabling it and expand next 

小提琴中手風琴的前兩個部分內有一個繼續按鈕。單擊繼續后,當前部分折疊,下一部分展開,我該如何實現?

您可以使用<a>標記上使用的相同方法

<div ng-init="accordion=1">
    <h3 class="accordion" ng-class="{active:accordion==1}">
        <a href ng-click="accordion = 1">Section 1</a>
    </h3>
    <p class="accordion-content" ng-show="accordion==1">Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using
  <br/>
 <button type="submit" style="max-width:200px" ng-click="accordion = 2" class="btn btn-primary btn-block pull-right">Continue</button></p>

    <h3 class="accordion" ng-class="{active:accordion==2}">
        <a href ng-click="accordion = 2">Section 2</a>
    </h3>
    <p class="accordion-content" ng-show="accordion==2">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using
  <br/>
 <button type="submit" style="max-width:200px" ng-click="accordion = 3" class="btn btn-primary btn-block pull-right">Continue</button>

  </p>

    <h3 class="accordion" ng-class="{active:accordion==3}">
        <a href ng-click="accordion = 3">Section 3</a>
    </h3>
    <p class="accordion-content" ng-show="accordion==3">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form</p>
</div>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM