将旧聊天消息添加到聊天框

Question

当用户滚动到顶部时，我试图将旧消息添加到聊天框。我正在使用 eventListeners 作为代码说明，但我遇到了一个错误，只有最后一个聊天框正常工作。似乎body[index].scrollTop 和body[index].scrollHeight 总是返回0，body[lastIndex] 除外。为什么会这样？ (logging body[index] 正确返回 div 元素)

document.querySelectorAll('.popup-messages').forEach((item, index) =>
{   
    item.addEventListener('scroll', async function()
    {
        if (chatReady[index] == true && bodies[index].scrollTop == 0)
        {
            chatReady[index] = false;
            var previousHeight = bodies[index].scrollHeight;
                    
            await getMessages(item.id.replace(":body", ""));
                    
            var heightDiff = bodies[index].scrollHeight - previousHeight;
            bodies[index].scrollTop += heightDiff;
        }
    })
})

编辑：如果有不同的方法可以动态创建多个 eventListeners，请与我分享，因为它会很有帮助。

Answer 1

通过用 item 替换 body[index] 解决了这个问题。当多个变量与一个元素相关联时，可能会出现错误。