使用jquery，ajax和setInterval滚动

Question

我想用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; }