每次刷新时滚动到div的底部

时间:2011-12-12 09:52:00

标签: html scroll refresh

目前,我有一个每8秒刷新一次的div。这个div基本上加载了一个php页面。 但是,我遇到了滚动到此页面底部的问题。 这是刷新和滚动到div底部的代码:

 <script>
    var refreshId = setInterval(function()
    {            
         $('#responsecontainer').fadeOut("slow").load('forum.php').fadeIn("slow");

         $('#chat').attr({ scrollTop: $('#chat').attr("scrollHeight") });
    }, 8000);

    </script>

div容器代码如下:

<div style="width: 100%; height: 300px; overflow: scroll; border: 5px ; background-color:#ccc ;" id="responsecontainer" name="chat">

            Loading..

 </div>

请告知我如何在刷新时进入div的底部。感谢

1 个答案:

答案 0 :(得分:1)

加载文档时应调用脚本。然后使用fadeOut和fadeIn动画将在加载后发生,因此它会重置滚动位置。下面的脚本可以工作,但最终没有这些动画。

load方法是一个XHR调用,它返回响应状态,使用它可以控制显示的数据。

$(document).ready(function() {
var refreshId = setInterval(function() {            
    $('#responsecontainer').load('forum.php', function(response, status, xhr) {
        if (status == "error") {
            var msg = "Sorry but there was an error: ";
            $("#error").html(msg + xhr.status + " " + xhr.statusText);
        }
        else{
            $('#responsecontainer').scrollTop($('#responsecontainer').height());        
        }
    });
}, 8000);
});