刷新后滚动到div底部

Question

我有一些基本的ajax来加载聊天中的新消息，我设置了用.load刷新div，用scroll height滚动到底部......唯一的问题是，.load强制将div放到顶部，而scrollheight强制放到底部，所以我的聊天只是上下跳动。我尝试了所有能想到的方法来解决这个问题，但都没有用。

<script>
setInterval("scroll();",1000); 
function scroll(){
var element = document.getElementById("chit");
    element.scrollTop = element.scrollHeight;
    $('#hat').load(location.href + ' #chit');
}
</script>




<?php   if(isset($_GET['user'])){ global $con;
    $get_id = $_GET['user'];
    $get_user = "select * from users where user_name='$get_id'";
    $run_user = mysqli_query($con,$get_user);
    $row_user = mysqli_fetch_array($run_user);
    $user2 = $row_user['user_name'];
    }
?>
<main role="main" id="chat" align="center">
<div id="chat_tit" align="center"><?php echo $user2 ; ?></div>
<div id="hat">
<div id="chit" align="left">

<?php 
$c_hat = "SELECT * FROM msg WHERE (user_to='$user' AND user_from='$user2') OR (user_from='$user' AND user_to='$user2')";
$run_chat = mysqli_query($con,$c_hat);

            while($chat=mysqli_fetch_array($run_chat)){
                $from = $chat['user_from'];
                $msg = $chat['msg_body'];
                $time = ago($chat['date']);

echo '<div id="chat_box"><div id="from">[<a href="pfp.php?user_name='.$from.'">'.$from.'</a>]</div><div id="time">'.$time.'</div><div id="msg">'.$msg.'</div>

<div id="underline"></div>

</div>';



}
?>
</div>
</div>

Answer 1

看起来您使用的是 setInterval() 当您可能需要使用 setTimeout(). setInterval() 每一秒钟都在被调用，所以这可能是它跳动的原因。setTimeout() 只会被调用一次。