首页 > 解决方案 > 运行几秒钟后,我的 AJAX 请求开始崩溃

问题描述

我试图每 4 秒刷新一次页面上的两个元素。我当前的 ajax 设置如下所示:

     setInterval(function () {
        update()
     }, 4000);

     function update() {
        $.get('/hello', function (data) {
            console.log("update")
            $('#main').html(data);
        });
     }

我的 HTML 有一个 id 为 main 的 div,其中包含两个 s 集。

工作几秒钟后,我的列表开始疯狂地复制项目,页面开始滞后。我在控制台中收到一条错误消息,提示“资源不足”。此外,我注意到应该在控制台中记录的“更新”不是每 4 秒发生一次,而是在不到 0.5 秒的时间内记录。

我试过使用 setTimeout 但它不起作用。

我的车把代码如下所示:

<div id="main">

    <div id="recalled">
        <ul id="list">
            {{#each thing}}
            <li>
              this.something
            </li>
            {{/each}}
        </ul>
    </div>

    <div id="more">
        <ul>
            {{#each anotherThing}}
            <li>
               this.property
            </li>
            {{/each}}
        </ul>
    </div>
</div>

我的快速代码在搜索(异步)mongo 数据库后呈现整个页面。

await User.find( {some search parameter}, function(error, data) {
res.render("thePage", {thing: data[0], anotherThing: data[1})
})

最初呈现的数据很好。

我只想使用 ajax 每隔几秒钟刷新一次列表元素,以显示对我的 User 模型的某个属性的任何更新。ajax 请求在几秒钟后开始吓坏了,并没有给我我期望的输出。

谢谢您的帮助!

标签: javascriptjqueryajaxmongodbhandlebars.js

解决方案


看看这个帖子。在您当前的代码中,无论上次调用的结果如何,您都严格每 4 秒调用一次更新函数。由于 ajax 调用是异步的,你应该使用 setTimeout 来确保你之前的调用已经完成。


推荐阅读