bootstrap-collapse

colapse插件:折叠功能

插件:collapse.js

实现方法：以data-toggle做被点击者，以div class="collapse in"显示展开内容

<script src="../extlib/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../extlib/bootstrap-3.3.5-dist/js/collapse.js" type="text/javascript" charset="utf-8"></script>
 <script src="../extlib/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
    <link rel="stylesheet" href="../extlib/bootstrap-3.3.5-dist/css/bootstrap.min.css">
<div class="container">
    <div class="row">
    <!-- data-toggle="collapse"不可缺少 -->
    <!-- class="collapse in" 也不可缺少  -->
        <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
            <a href="#zhedie" class="btn" data-toggle="collapse">点击我显示折叠内容</a>
            <div id="zhedie" class="collapse in">
               <ul>
                   <li><a href="#showContent1">显示内容1</a></li>
                   <li><a href="#showContent2">显示内容2</a></li>
               </ul>
            </div>

        </div>
    </div>
</div>

显示效果：