Question

我已经构建了一个ajax聊天应用程序，但现在当它刷新聊天（加载所有新聊天）时，似乎在删除所有当前聊天和加载所有聊天（包括新聊天）之间暂停。这是在一个计时器上设置的，所以每当它运行时，它就会有这种空白的差距，然后跳到页面的顶部（div的顶部会刷新）我需要做什么来确保它不会发生了吗？即：我如何将等待时间排除/做不同？

$(document).ready(function() {
window.setInterval(function(){
    $('#chat-messages').empty();
    getMessages(meid, friendid);
}, 5000);
});

$.ajax({
    url: 'getAllMessages.php',
    data: 'id='+id+'&&friend='+friendid,
    type: 'POST',
    success: function(res) {
        // processing code goes in here, it was too long so I took it out.
    }
});

Answer 1

$.ajax({
    url: 'getAllMessages.php',
    data: 'id='+id+'&&friend='+friendid,
    type: 'POST',
    success: function(res) {
        $('#chat-messages').empty(); 
        // empty on success to avoid delay caused due to ajax request
    }
});

减少间隔时间
添加新内容，而不是删除旧内容并添加新内容。
使用setTimeout调用并将其添加到成功块

Answer 2

我认为你能做的最好的事情就是添加一个名为＆＃34; last-update＆＃34;的新参数。并且只获取上次成功查询中的新消息...

然而，你只需要做一些像

这样的事情

 $('#chat-messages').append(new_messages)

您将优化聊天刷新，网络延迟和mysql： - ）

使用ajax数据刷新div的更有效方法

2 个答案: