Question

我有一个效果很好的聊天框。它在两个用户之间获取消息，并将滚动条定位在底部，直到用户向上滚动。当用户发送新消息时，滚动条会跳到底部，并显示新消息。

<script>
var currentID = null;
var chatTimer = null;
var scrolled;
function fetch_data() {
  $.ajax({
    url: "select.php",
    method: "POST",
    success: function(data) {
      $('#live_data').html(data);
      //fetch_chat();
    }
  });
}

function fetch_chat() {

  $.ajax({
    url: "fetch_chat.php",
    method: "POST",
    data: {
      id: currentID
    },
    dataType: "text",
    success: function(data) {
      $("#messages").show();
      $('#messages').html(data);
      $("div.area").show();
      //chatTimer = setTimeout(fetch_chat, 500); //request the chat again in 2 seconds time
      if(!scrolled){
        $("#messages").animate({ scrollTop: $(document).height() }, "fast");
        scrolled=true;
      }

    }

  });

}

$(document).ready(function() {
        $("#messages").on('scroll',function(){
        scrolled=true;
    });
 fetch_data();

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

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('');
       $("#messages").animate({ scrollTop: $(document).height() }, "fast");
    });
  });

});
</script>

我每次都使用setInterval()刷新fetch_chat()，以便正在聊天的用户看到新消息。打嗝是setInterval()显示聊天框，我希望仅在用户点击名称时显示该聊天框。第二件事是，当用户＆＃39; a＆＃39;向用户发送消息＆＃39;＃，滚动条保留在底部，新文本显示在一侧，但滚动条不会移到b＆＃的底部39; s。

聊天框滚动条未使用新消息进行更新

0 个答案: