一定间隔后自动更新页面

Question

我有一个网站，人们可以像任何社交媒体一样添加帖子和评论。

除了自动更新功能外，一切都运行良好：我想要的是每20秒后自动更新页面。

通过更新页面，我的意思是它会自动向页面显示新添加的帖子和评论。

我可以通过像

这样的ajax加载函数来做到这一点

$('#divid').load("page.php #divid");

但是在这种情况下存在一个问题：当任何用户输入内容时，如果重新加载div，则用户文本丢失;如果我有的是无限滚动加载功能，导致网站反复加载项目。

我认为这是可能的，因为许多网站都做这件事，类似gmail向我们显示新电子邮件而不重新加载div。

Answer 1

您应该做的是将新帖子添加到页面顶部，而不是重新加载所有内容。

AJAX响应的一个例子应该是这样的：

{
    "posts": [
        {
            "id": "1234",
            "title": "Post Title",
            ...
        },
        {
            "id": "1235",
            "title": "Post Title",
            ...
        }
    ],
    "comments": [
        {
            "id": "12345678",
            "post_id": "1112",
            "content": "foo",
            ...
        }
    ]
}

posts数组应该预先添加到页面。 comments数组的每个项目都应附加到相应帖子的评论部分。