Javascript 使用jquery单击外部时引导折叠/隐藏

我已经创建了一个公文包页面，尝试使用bootstrap的折叠功能。它工作得很好，但是当其中一个div打开时，您单击另一个div，第一个div保持打开状态，依此类推！我可以就这样离开，但它看起来很糟糕。：）

这是我的密码：

<div class="col-md-4">
<a data-toggle="collapse" data-target="#project-1">
 <figure><img src="images/work/2.jpg" alt="" class="img-responsive"></figure>
</a>        

和崩溃部门：

<div class="row">
 <div class="project-info collapse animated fadeInRightBig" id="project-1">
    <div class="col-md-6">
       <figure><img src="images/work/2.jpg" alt="" class="img-responsive"></figure>
    </div> 

    <div class="col-md-6">
     <button class="btn btn-primary" data-toggle="collapse" data-target="#project-1">Close</button>
        <h3>This is My Project Description</h3>
    </div>
</div>

接近
这是我的项目描述

---

有一些缩略图按顺序排列，如project-1、project-2、project-3。

假设您使用的是Bootstrap 3，您只需确保所有折叠都在同一个

面板组中即可

请参阅Bootstrap 3文档中的

像这样：

<div class="panel-group" id="accordion">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
          Collapsible Group Item #1
        </a>
      </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse in">
      <div class="panel-body">
        Anim pariatur cliche reprehenderit
      </div>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
          Collapsible Group Item #2
        </a>
      </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse">
      <div class="panel-body">
        Anim pariatur cliche reprehenderit
      </div>
    </div>
  </div>
</div>


陈词滥调
陈词滥调

听起来你在寻找手风琴的功能：谢谢你，约书亚。好的，这是一个解决方案，使用accordios（现在我不是..我使用simple data toggle=“collapse”），但是我需要重写所有代码。我认为使用jquery有一个简单的解决方案。谢谢