2017-03-01 10 views
1

私はテキストボックスとボタンを持っています。 div内のテーブルに追加ボタンを押した後。 max-height:100px;overflow-y:auto;を超えたときに、divの下にスクロールするdivを指定します。addbarcode();メソッドは、jquery dataTable methodを呼び出してサーバー側にデータを取り込むajax投稿です。Divを下にスクロールする方法

すべてのdoesntのWO試み上記3

var objDiv = document.getElementById("divcontent"); 
       objDiv.scrollTop = objDiv.scrollHeight; 

を試みる2

var element = document.getElementById("divcontent"); 
       $('#divcontent').scrollTo(element.get(0).scrollHeight); 

を試みる1

var element = document.getElementById("divcontent"); 

     element.scrollIntoView(false); 

を試しますrk。

編集

<div class="row" id="divcontent" style="max-height:100px; overflow-y:auto"> 

<div class="col-md-12 col-sm-12"> 
    <table class="table table-striped table-responsive" id="codelist"> 
     <thead> 
      <tr> 
       <th> 
        SN 
       </th> 
       <th> 
        Serial Number 
       </th> 

      </tr> 
     </thead> 
    </table> 


</div> 

Javascriptを

$(document).ready(function() { 
    $("#scanner").on('keyup paste', function (e) { 
     var code = (e.keyCode ? e.keyCode : e.which); 
     if (code == 13) { //Enter keycode 
      var artno = $(this).val(); 
      if (artno.length == 32 &&) { 
       addbarcode(); 
       $(this).val(""); 

      } else { 
       $(this).val(""); 
      } 
      var element = document.getElementById("divcontent"); 

      element.scrollIntoView(false); 
     } 


    }); 

}) 

最終作業コード はスムーズスクロールを許可するようにアニメーションを追加しました。また、タイマーをajaxコードとしてHTMLレンダリングよりも速く実行するように追加しました。少し遅れて設定すると、javascriptは完全な高さをキャプチャできます。

function divscrolldown() { 
    setTimeout(function() { 
     $('#divcontent').animate({ 
      scrollTop: $("#divcontent").offset().top 
     }, 500); 

    }, 200); 
+0

あなたは何を試してみましたか?あなたのコードを私たちに教えてください。 –

+0

divといくつかのCSSを試してください –

+0

遅く返事を申し訳ありません。私のコード –

答えて

2
element.scrollIntoView(false); 

false場合、素子の底部は、スクロール可能な祖先の可視領域の下に位置合わせされます。

MDN:Element.scrollIntoView()

+0

こんにちは、この仕事は、または間違った場所に追加しています。 –

+0

私はちょうど私が間違ったボタンイベントにそれを追加していることに気づいた。スクロールが今動作する –

関連する問題