私は私のプロジェクトでは、ブートストラップ崩壊を使用していたブートストラップ崩壊

Question

をクリックすると、ページが現在位置を失います。崩壊が正常に動作しているが、問題は、私は折りたたみ可能なリンクをクリックすると、ページが一番上にスクロールされ、これは長いスクロール後はメニューを崩壊

を置いています。ここで

私はそれが内崩壊前と同じ位置にページをしたいとどのように私は、このスクロール問題を解決することができます

は私のコードです：ここでは

<div class="row"> 
    <div class="col-md-12"> 
    <br /> 
    <h4><a href="#" data-toggle="collapse" data-target="#div_addtraining">Insert Training</a><br /></h4> 
    <div id="div_addtraining" class="collapse" style="overflow-x:auto;"> 
     Test Test Test Test <br />Test Test Test <br /> 
    </div> 
    </div> 
</div> 

は一例です：

http://jsbin.com/sayunibobu/1/edit?html,js,output

Answer 1

問題がhref属性です。ケースでは、トリガの使用aちょうど崩壊DIV（#div_addtraining）のIDのHREFを使用しています。一番下の行で

：

が置き換え

<a href="#" data-toggle="collapse" data-target="#div_addtraining"> 

<a href="#div_addtraining" data-toggle="collapse"> 

へと作業例：

.row { 
 
    margin-top:3000px; 
 
}

<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<meta charset="utf-8"> 
 
<meta name="viewport" content="width=device-width"> 
 
<title>JS Bin</title> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 

 
<div class="row"> 
 
    <div class="col-md-12"> 
 
    <br /> 
 
    <h4><a href="#div_addtraining" data-toggle="collapse">Insert Training</a><br /></h4> 
 
    <div id="div_addtraining" class="collapse" style="overflow-x:auto;"> 
 
     Test Test Test Test <br />Test Test Test <br /> 
 
    </div> 
 
    </div> 
 
</div>