コンテンツをリフレッシュ/リロードした後にdivに移動する

Question

Divを5秒ごとにリフレッシュしました。 divはスクロールしてスクロールできるように設定されていますが、リフレッシュが発生するとdivのスクロールが先頭に戻ります。どのように私はdivの後にスクロールの位置を保持することができます任意のアイデアは更新されますか？

#alerts_container { 
    height: 150px; 
    width: 250px; 
    overflow: scroll; 
    overflow-x: hidden; 
    border-right-width: 1px; 
    border-right-style: solid; 
    border-right-color: #666; 
} 

JS：

refresh_alerts = setInterval(function(){ 
    $('#leftside div#alerts_container').load('staffhome.php #alerts_container'); 
}, 5000) 

HTML：ここ

は私のCSSです

<div id='alerts_container'> 
    <?php 
    include_once('includes/my_alerts.php'); 
    ?> 
</div> 

これは私のために働くことを得るために使用されるSKSの答えが、私は変更する必要がなかったです彼のコードは少し上がった：

var isScrolling = false; 
var lastScrollPos = 0; 
var counter = 0; 
$(function() { 
    $('#alerts_container').bind("scroll", function(){ 
     isScrolling = true; 
    }); 
    refresh_alerts = setInterval(refreshContent, 5000); 
    function refreshContent() { 
     lastScrollPos = $('#alerts_container').scrollTop(); 
     if (!isScrolling) { 
      $('#alerts_wrapper').load('staffhome.php #alerts_container', function() { 
      $('#alerts_container').scrollTop(lastScrollPos); 
      }); 
     } 
     isScrolling = false; 
    } 
}); 

Answer 1

あなたは.scrollTopを使用してスクロールハンドラ内でスクロールの高さを取得し、.load

DEMO後にそれを設定する必要があります - ダウンすべての方法をスクロールしてみて、新しい内容が更新され得るために、5秒待ってください。以下は

は、

var lastScrollPos = 0; 
$('#scrollingDiv').on('scroll', function() { 
    lastScrollPos = this.scrollTop; 
}); 

デモから抽象的であり、あなたがコンテンツを交換するだけでコンテナに新しい情報を追加していない場合.loadコールバックで

$('#leftside div#alerts_container').load('staffhome.php #alerts_container' , function() { 
    $(this).scrollTop(lastScrollPos); 
}); 

Answer 2

は私が考えています単純に機能するだろう。

http://api.jquery.com/jQuery.get/

http://api.jquery.com/append/