我想用php,ajax和jquery构建一个简单的消息系统。我的问题是我不知道如何在我的消息框中向下滚动到最后一条消息。我之前问过如何解决这个问题,但是知道有一个新问题。它向下滚动,但每次用ajax重新加载消息时,它会一次又一次地跳到中间和中间。所以问题是滚动条不会停留在底部。请帮帮我。
$(document).ready(function(){
$('#start_conversation').click(function() {
$('#message_dialog').dialog();
var interval = setInterval(function() {
$.ajax({
type : "POST",
url: 'get_messages_project.php',
data: ... ,
success: function(data) {
$('#show_messages').html(data);
//Scroll
$('#show_messages').scrollTop($('#show_messages').children('div').last().offset().top);
}
});
}, 1000);
return false;
});
});
CSS和HTML
<div id="message_dialog" class="message_box">
<div id="show_messages"></div>
<form action="#" method="post" id="message_form">
<label>Say something:</label>
<textarea id="message"></textarea>
<input type="submit" id="send_message" value="Send Message">
</form>
</div>
#show_messages {
text-align:left;
margin:0 auto;
margin-bottom:25px;
padding:10px;
background:#fff;
height:200px;
width:250px;
border:1px solid #ACD8F0;
overflow:auto; }