Javascript 行为不稳定的div。论破产与破产

如果你能注意到我的话，当你点击工具栏的时候，它会下降并上升一点。当div被扩展时，它会闪烁。请检查代码

我使用了一个开关，它最初是折叠的。但一旦你点击Bar1，div就会关闭。当你再次点击它时，它会掉下来，表现得有点奇怪。像闪烁一样重新调整自己。我无法找出问题所在以及如何解决。请提供一些帮助

<div class="container" id="container">
<div class="row" id="header"> <!-- Header -->
  <div class="col-xs-12" id="logo" data-toggle="collapse" data-target="#main">
    ABC<span class="glyphicon glyphicon-menu-down" id="icon" ></span>
  </div>
</div>

<div class="row" id="main"> <!-- Main -->
  <div class="col-xs-12">
    <div class="row mystyle"> <!-- Buttons -->
      <div class="col-xs-6" id="buttons">
        <button id="video-button" class="btn btn-sample btn-block">Detail1</button>
      </div>
      <div class="col-xs-6" id="buttons">
        <button id="channel-button" class="btn btn-sample btn-block">Detail2</button>
      </div>
    </div>
  </div>
  <!-- Detail Starts from here! -->
  <div class="row video-main-style" id="video-detail">
    <!-- Name -->
    <div class="row">
      <div class="col-xs-12" id="video-name">
        <h1>ABC</h1>
      </div>
    </div>
    <!--  goes here -->
    <div class="row main-style">
      <div class="row" data-toggle="collapse" data-target="#views-compared-data">
        <div class="col-xs-12" id="views-compared">Bar1<span class="glyphicon glyphicon-menu-down" id="icon-accord"></span></div>
      </div>

      <div class="row" id="views-compared-data">
        <div class="col-xs-12">
            Some random data<br />
            More randomn data<br />
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. 
          </div>
      </div>
    </div>
  </div>
</div>

提前谢谢

---

PS这是上面代码的一部分。

假设您也在使用引导程序，根据您的类名，您应该将类

collase

或

collapse in

（取决于默认情况下是关闭还是打开）添加到包含数据的数据行中，如下所示

<div class="row collapse" id="views-compared-data">
...
</div>

...

您看到的行为是在第一个切换中添加

collapse

类

---

看和

你能加把小提琴吗？您使用的是什么版本的jquery版本2.0.3

<div class="row collapse" id="views-compared-data">
...
</div>