可折叠的打开/关闭div未关闭

时间:2018-02-04 22:05:53

标签: html css twitter-bootstrap

这个Bootstrap中可折叠打开/关闭面板的代码正常打开但是当打开它时它的问题只有在我打开另一个时才会关闭,我在在线编辑器中测试它的工作但不能在我的web应用程序中工作我不知道为什么。

.panel-heading [data-toggle="collapse"]:after {
  font-family: 'Glyphicons Halflings';
  content: "\e072";
  float: right;
  color: #183F66;
  font-size: 18px;
  line-height: 22px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container col-sm-10">
  <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">
                  Abstract
                  </a>
              </h4>
          </div>
          <div id="collapseOne" class="panel-collapse collapse in">
              <div class="panel-body">
                  ...
              </div>
          </div>
      </div> <!-- .panel -->

      <div class="panel panel-default">
          <div class="panel-heading">
              <h4 class="panel-title">
                  <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                      Student Group
                  </a>
              </h4>
          </div>
          <div id="collapseTwo" class="panel-collapse collapse">
              <div class="panel-body">
                  ...
              </div>
          </div>
      </div> <!-- .panel -->

      <div class="panel panel-default">
          <div class="panel-heading">
              <h4 class="panel-title">
                  <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                      Contact with students
                  </a>
              </h4>
          </div>
          <div id="collapseThree" class="panel-collapse collapse">
              <div class="panel-body">
                  ...
              </div>
          </div>
      </div> <!-- .panel -->
  </div> <!-- .panel-group -->
</div> <!-- .container -->

1 个答案:

答案 0 :(得分:0)

我发现问题发生了,因为我首先在布局页面中包含两次引导程序库和java脚本,然后在我删除此行时第二次包含它正常工作。

@staticmethod
def awesome_method(x): return x