消息传递离开滚动条的位置

Question

我的脚本出现问题，因为它没有完成基本的聊天算法。

<script>
$ = jQuery;
var currentID = null;
var chatTimer = null;
var scrolled=false;

function fetch_data() {
  $.ajax({
    url: "select.php",
    method: "POST",
    success: function(data) {
      $('#live_data').html(data);
     }
  });
}

function fetch_chat() {

  $.ajax({
    url: "fetch_chat.php",
    method: "POST",
    data: {
      id: currentID
    },
    dataType: "text",
    success: function(data) {
      $("#chatbox").show();
      $('#messages').html(data);
      $("div.area").show();
      if(!scrolled){
      $('#messages').scrollTop($('#messages')[0].scrollHeight);
      scrolled=true;
      }
    }

  });

}

$(document).ready(function() {

 fetch_data();

  $(document).on('click', '.first_name', function() {
    currentID = $(this).data("id1");
    setInterval(function() {
    fetch_chat();}, 500);
});



  $("#sub").click(function() {
    var text = $("#text").val();
    $.post('insert_chat.php', {
      id: currentID,
      msg: text
    }, function(data) {
      $("#messages").append(data);
      $("#text").val('');
    });
  });

});
</script>

我想让滚动条保持在底部，直到用户想要将其向上滚动并且滚动条应该保持更新到底部（到最后一条消息），但是滚动条保持在它最初的位置并且消息保持不变添加到底部。