Question

我需要更正此代码的帮助。我想一次只打开1个元素，但是我不知道该怎么做。如果我单击两个，它们都打开，而另一个不关闭。

我使用

X, Y = np.meshgrid(geos_lon, geos_lat);
Z = X;
plt.pcolormesh(X, Y, Z, alpha=0.5)

我也使用此功能隐藏和显示元素。

<div class="accordion" id="accordion">
  <div class="row">
<!--NUMERO 1-->
<div class="panel clp" style="width: 100%" onmouseover="numero1();" onmouseout="defaultc();">
  <div class="panel-heading" id="headingOne">
    <h4 class="panel-title">
      <a role="collapsed" data-toggle="collapse" data-parent="#accordion" data-target="collapseOne" aria-expanded="false" aria-controls="collapseOne">
          UI / UX
      </a>
    </h4>
  </div>
  <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
    <div class="panel-body">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
    </div>
  </div>
</div>
<!--NUMERO 2-->
<div class="panel panel-default clp"  style="width: 100%" onmouseover="numero2();" onmouseout="defaultc();">
    <div class="panel-heading" role="tab" id="headingTwo" >
      <h4 class="panel-title">
        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" data-target="collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
            Branding & Art Direction 
        </a>
      </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
      <div class="panel-body">
          Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
      </div>
    </div>
  </div>

Answer 1

尝试一下。您无需为此编写自定义JavaScript。

 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">


    <title>Hello, world!</title>
  </head>
  <body>
      <div class="accordion" id="accordionExample">
            <div class="card">
              <div class="card-header" id="headingOne">
                <h5 class="mb-0">
                  <button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                        UI / UX
                  </button>
                </h5>
              </div>
          
              <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
                <div class="card-body">
                     Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
                </div>
              </div>
            </div>
            <div class="card">
              <div class="card-header" id="headingTwo">
                <h5 class="mb-0">
                  <button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                        Branding & Art Direction 
                  </button>
                </h5>
              </div>
              <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
                <div class="card-body">
                     Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
                </div>
              </div>
            </div>
           
          </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
 
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> 
    </body>

引导程序一次只能崩溃一次

1 个答案: