javascript - 包含 PHP 文件的 jquery div 刷新

Question

我正在使用这段代码不断刷新 PHP 包含的 div:

$(document).ready(function() {
setInterval(function() {
     $('#ContentLeft').load('live_stats1.php').fadeIn("slow");
     $('#ContentRight').load('live_stats2.php').fadeIn("slow");
}, 2000);

});

我的 HTML 看起来像:

<div id="ContentLeft">
<?php include 'live_stats1.php'; ?>
</div>

<div id="ContentRight">
<?php include 'live_stats2.php'; ?>
</div>

当我查看 Google Chrome 的控制台时，显示 live_stat1.php 和 live_stats2.php 页面不断加载，这是否会导致问题，因为它们不断刷新并减慢互联网速度/在互联网连接上使用大量带宽它正在运行吗？

Answer 1

这取决于在 live_stats1.php 和 live_stats2.php 中完成的处理量 我猜是因为您正在加载某种类型的统计数据在这些脚本中进行相当多的数据库查询。

我认为 2 秒是一个非常短的间隔，我会考虑增加它。让某人对这些脚本完成所需的时间进行基准测试并找到最佳间隔时间。

当您使用 .load() 时，您可以考虑在其完成时添加一个回调并设置一个变量。然后在每个循环中，您可以检查之前的加载是否已完成。因为尝试继续加载还没有时间完成的脚本是没有意义的

var contentLeftLoaded = true;
var contentRightLoaded = true;
setInterval(function() {

    //Has content loaded from previous request
    if(contentLeftLoaded) {
        contentLeftLoaded = false;
        $('#ContentLeft').load('live_stats1.php', function() {
            $('#ContentLeft').fadeIn("slow");
            contentLeftLoaded = true;
        });
    }
    if(contentRightLoaded) {
        contentRightLoaded = false;
        $('#ContentRight').load('live_stats2.php', function() {
            $('#ContentRight').fadeIn("slow");
            contentRightLoaded = true;
        });
    }
}, 2000);