JS Akkordeon nicht kollabiert alle Registerkarten

Question

Okay, so ich dieses Akkordeon auf einer Seite habe ich mache und hier ist der Code dafür:

<section> 
    <div class="container"> 
    <div class="row"> 
     <div class="col-sm-12 text-center"> 
     <h4 class="mb16">Frequently Asked Questions</h4> 
     <p class="lead mb64"> Holla @twitterhandle if you've got more questions and we'll do our best to answer. </p> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col-sm-10 col-sm-offset-1"> 
     <ul class="accordion accordion-2 one-open"> 
      <li> 
      <div class="title"> 
       <h4 class="inline-block mb0">How can X increase productivity?</h4> 
      </div> 
      <div class="content"> 
       <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
      </div> 
      </li> 
      <li> 
      <div class="title"> 
       <h4 class="inline-block mb0">Does X do X?</h4> 
      </div> 
      <div class="content"> 
       <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
      </div> 
      </li> 
      <li> 
      <div class="title"> 
       <h4 class="inline-block mb0">Will my staff need to take a course on how to operate the application?</h4> 
      </div> 
      <div class="content"> 
       <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
      </div> 
      </li> 
      <li> 
      <div class="title"> 
       <h4 class="inline-block mb0">What does X offer?&nbsp;</h4> 
      </div> 
      <div class="content"> 
       <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p> 
      </div> 
      </li> 
     </ul> 
     </div> 
    </div> 
    </div> 
</section> 

Die JS für das Akkordeon ist:

$('.accordion li').click(function() { 
    if ($(this).closest('.accordion').hasClass('one-open')) { 
     $(this).closest('.accordion').find('li').removeClass('active'); 
     $(this).addClass('active'); 
    } else { 
     $(this).toggleClass('active'); 
    } 
}); 

Alle Registerkarten sind geschlossen, wenn ich die Seite neu lade. Aber nachdem ich einen von ihnen erweitert habe, kann ich sie nicht alle wieder schließen. Einer von ihnen bleibt offen. Jede Hilfe wäre willkommen.

Answer 1

Nicht nach Code schließen. Setzen Sie die reduzierbare Eigenschaft auf true, wenn Sie alle Tabs schließen möchten. Dies ist ein Beispielcode.

<script> 
    $(function() { 
     $("#accordion").accordion({ 
      collapsible: true 
     }); 
    }); 
</script>