bootstrap手风琴样式不折叠

Question

<section>
<div class="panel-heading api-section">
  <h4 class="panel-title">
    <a class="api-ta" data-toggle="collapse" data-parent="#accordion" href="#collapse1">
        基本信息<i class="fa fa-2 fa-hand-o-up text-info pull-right"></i>
    </a>
  </h4>
</div>
<div id="collapse1" class="panel-collapse collapse in" style="font-size: 15px;">
  <div class="panel-body">
    <form id="form1" class="form-inline" action="xxxxxx.action" 
          data-remote="true" data-method="post" data-type="json" data-success="savaCallback">
    </form>
  </div>
</div>
</section>

有一段这样的页面，点击a的时候，有时panel-body能正常折叠起来，有时候就没反应，看firebug发现折叠以后class还是collapse in，希望各位大牛帮帮忙。

引入顺序应该是没错的，是bootstrap.css jquery.js bootstrap.js,而且我遇到的问题也不是点了毫无反应，是点击了以后会有从collapse in到collapsing的变化，但是最终结果仍是collapse in，不是正常应该的collapse。展开都正常的，就是无法收拢。

Answer 1

务必要正确引入相应的js文件，然后你可以copy官网试试，比较下

Answer 2

恩，要按正确顺序引入jquery