SetInterval 带回以前的数据

SetInterval brings back previous data

所以,我正在尝试构建一个简单的函数来传送两个用户之间的所有消息。就像一个聊天应用程序。我正在使用 setInterval 来刷新消息,以防某些用户在数据库中插入新消息,但它正在发生: 当我 select 一个对话,然后 select 另一个对话时,该功能会在显示新 select 对话的消息之前将前一个对话的消息带回一秒钟。这是:

    // Load messages
    $(".from_messages").click(function() {
        $("#messageList").empty();
        var from = $(this).attr('user_id');
        var user = <?php echo $_SESSION['user_id']; ?>;
        $("input[name='to']").val(from);
        retrieve(from, user);
    })

    //Interval
    function retrieve(from, user) {
        var interval = setInterval(function() {
            $("#messageList").empty();
            $.ajax({
                url: "server.php",
                method: "post",
                dataType: "json",
                data: {"from": from, "user": user},
                success: function(response) {
                    if(response != "") {
                        $(response).each(function(index, item) {
                            if(item.from_id == user) {
                                $("#messageList").append('<div class="col-12 text-right"><p class="w-50 ml-auto">- '+item.message+'</p></div><br>');
                            } else {
                                $("#messageList").append('<div class="col-12"><p class="w-50">- '+item.message+'</p></div><br>');
                            }
                        })
                    }
                }
            })
        }, 3000)
    }

如果有人能帮助我,我将感激不尽。这是一个 link,我希望它能展示我所面临的情况:Video demostration

setInterval(f, n) 将每 n 毫秒触发 f,直到您清除间隔。当您调用 setInterval 时,它 returns 是对区间的引用。保存该参考并在您希望间隔停止时调用 clearInterval(reference)——在这种情况下,在您 select 不同的对话创建新间隔之前。