即使在刷新后，也可以锁定聊天框 div 底部的滚动条

Question

嘿，我的网站中有一个聊天框，我需要将滚动条始终锁定在底部，以便新消息始终在用户面前....我试过像

  <div id="mainchatdiv" 
 style="overflow-y:scroll; width:100%;height:247px;background-color:#FAF4ED;">
...........messagea are here...

   </div>
<script>
    var auto_refresh = setInterval(
        function () {
            $('#mainchatdiv').load('home.php #mainchatdiv').fadeIn("slow");
        }, 5000);
    $("#mainchatdiv").scrollTop($("#mainchatdiv")[0].scrollHeight);
</script>

代码正在工作，但每当它刷新时，滚动条就会再次上升......

Answer 1

这个 1 怎么样：-

var auto_refresh = setInterval(
        function () {
            $('#mainchatdiv').load('home.php #mainchatdiv').fadeIn("slow");
            $("#mainchatdiv").scrollTop($("#mainchatdiv")[0].scrollHeight);
        }, 5000);
    $("#mainchatdiv").scrollTop($("#mainchatdiv")[0].scrollHeight);

Answer 2

<script>
var auto_refresh = setInterval(
    function () {
        $('#mainchatdiv').load('home.php #mainchatdiv').fadeIn("slow");
    }, 5000);
 var chatDiv = document.getElementById("mainchatdiv");
 chatDiv.scrollTop = chatDiv.scrollHeight;
</script>