AJAX 채팅, 새로 고침 및 많은 메시지

Question

Im 순간에 아약스 채팅을 직접 프로그래밍합니다. 핵심 물건이 완료,하지만 난이 문제를 가지고있다 : 2 초마다 새 메시지 확인

1. 임, 그리고 새 메시지가있는 경우 나 부모의 채팅 창으로 .Append()를 추가합니다. 그러나 내가 요소를 추가 할 때마다 채팅이 깜박이며보기에도 좋고 수용 가능한 문제도 아닙니다. 그리고, 내 두 번째 문제로 나를 이끌고, 요소의 스크롤을 다시 설정합니다.

2. 채팅을 항상 하단으로 스크롤하고 싶기 때문에 지금은 .animate({ scrollTop: $(document).innerHeight() }, 1);을 사용합니다. 그러나 일정한 양의 메시지 또는 하위 요소에서 스크롤은 단지 중간에 머물러 있습니다 ...

두 가지 문제를 모두 찾았지만 아직 도움을 찾지 못했습니다. 그리고 나 혼자서 전체 채팅을 한 이후로 나는 많은 것을 봤다.

의견이나 제안을 보내 주셔서 감사합니다. 채팅 기능을 개선하는 방법 :)

편집 : 당신은 당신이 문서가 아닌 스크롤 할 요소의 높이를 점점 스크롤 추가] 코드

 `// For loop for every chat window 
     for(i = 0; i < chatListArray.length; i++) 
     { 
      (function(id) { 
       // Ajax call to get the chat history 
       $.ajax({ 
        type: "POST", 
        url: 'code/submit/submitGetChat.php', 
        data: "id=" + id, 
        success: function(data){    
         $('#chatItemContent_' + id).empty(); // Clear the window 
         $('#chatItemContent_' + id).append(data); // Append the new chat history 
         $('#chatItemContent_' + id).animate({ scrollTop: $(document).innerHeight() }, 1); // scroll down to bottom, to display the latest messages 
        } 
       }); 
      })(chatListArray[i]); // callback 
     }` 

Answer 1

. 이거 해봤 니?

$('#chatItemContent_' + id).animate({ scrollTop: $('#chatItemContent_' + id).innerHeight() }, 1); 

문서 높이가 아닌 현재 채팅 창 높이에 따라 scrollTop을 설정합니다.