如何每 5 秒使用 AJAX 刷新 iFrame？答案

【问题标题】：How to refresh an iFrame with AJAX every 5 seconds?如何每 5 秒使用 AJAX 刷新 iFrame？
【发布时间】：2015-07-20 12:09:47
【问题描述】：

我正在尝试使用 AJAX 刷新 iFrame，因此我页面上的 iFrame 不会闪烁。下面的代码有效，但它是一个主要的内存猪，它会在大约 2 分钟后崩溃页面。我试图让它工作，所以它不会崩溃页面。

我正在使用其中有一个表格的 iFrame，我希望它每 2 秒获取一次内容，以便对其进行更新。下面的 AJAX 代码位于名为 table.php 的页面中。我在名为 dispatch1.php 的主页上的 iFrame 中有这个页面（table.php）。表 id 是“thistable”。

<script>
    function checkRequest(){
      var interval = setInterval(function(){
      var request = $.ajax({
        url: "table.php",
        type: "post",
        datatype: "html"
      });
      request.done(function(msg){
        $("#thistable").html(msg);
      });
      },2000)
     }
    </script>

【问题讨论】：

不清楚这段代码是 iframe 还是父窗口的一部分。顺便说一句，您需要在问题中提供更多上下文，例如，您如何调用 checkRequest() 方法？顺便说一句，如果您的请求需要超过 2 秒才能完成，您将面临一些问题，也许是目前正在发生的事情。通常，要刷新 iframe，您只需更新 src 属性（可能使用时间戳来避免任何缓存问题），但我想这就是您不这样做的原因：I am trying to refresh an iFrame with AJAX so the iFrame on my page doesn't blink
是checkRequest 被一次又一次地调用...听起来像。如果它被称为 eevry 2 秒，则您通过添加新的间隔计时器来复合每次发出的请求数
如何将setInterval 更改为setTimeout 并在AJAX 的成功回调中调用与setTimeout 关联的函数？这并不能确保延迟，但甚至不会导致浏览器崩溃

标签： javascript jquery html ajax iframe

【解决方案1】：

我认为最好的方法是使用setTimeout，这意味着该函数将在上一次调用完成五秒后再次调用，这不是每五秒刷新一次页面，而是在上一次刷新五秒后和所以它不应该让浏览器崩溃。
取而代之的是 setInterval 将每五秒调用一次函数，而不管之前的调用是否完成，所以这可能是问题所在。

function checkRequest() {
    var interval = setTimeout(function () {
        $.ajax({
            url: "table.php",
            type: "post",
            datatype: "html"
        })
            .done(function (msg) {
            $("#thistable").html(msg);
        })
            .always(function () {
            checkRequest();
        });
    }, 5000);
}

【讨论】：

我已经尝试过了，到目前为止它正在工作。在图像here 中，Chrome 中的“网络”选项卡在打开时显示它以 MB 或 KB 为单位以恒定速率传输。但是，这仍然没有导致浏览器内存不足和崩溃，所以这很好。我会告诉你这是否是最终的解决方案。感谢您的帮助！

【解决方案2】：

我相信您正在寻找的是setInterval()，您可以根据需要调用document.ready 上的setinterval 或单击某个按钮。

在这里，setInerval 将每 5 秒运行一次脚本

<script>
    $(function(){

        setInterval(function(){ 
           repeatedAjaxRequest();

         }, 5000);
        });

        function repeatedAjaxRequest(){

        //Your ajax statements goes here

        }
<script>

查看链接了解更多信息Difference between setInterval and setTimeout

【讨论】：