Question

jquery noob在这里。

我对专业人士和有jquery经验的人有疑问。我创建了这个脚本，但我正在努力提高它的效率。无论如何，我的想法是我在HTML页面上有多个来自MYSQL数据库的PHP条目。

所以，

A - A2

B - B2

C - C2

不，A，B和C是静态的。它只是从数据库中读取。 A2，B2，C2是每10秒更新一次的动态元素。在当前形式中，我为每个条目都有多个javascript副本，效率极低。在大约100个条目中，我的CPU使用率达到20-40％。

脚本如下：

<script>
$(function() { 
var refreshId = setInterval(function()
{
$('#UpdateDiv<?php echo $entry; ?>').load('live.php?entry=<?php echo $entry; ?>').fadeIn("slow");
 }, 10000);
});
</script>
<?PHP
echo '<div id="UpdateDiv'.$entry.'"></div>';
?>

谢谢！

Answer 1

问题是每个div元素都有自己的脚本，因此会发送自己的请求。

基本上，每10秒，你就会发出100个请求。

相反，你应该有一个脚本每10秒加载一次新数据（可能是json格式），然后改变每个div的内容。

你可以通过遍历json数组中的每个元素并设置（伪代码）

来做到这一点

for each i
  div[i].innerHTML(jsonarray[i])

其中div [i]是表示每个div的jquery对象。

要为每个条目加载数据，您需要使用名为（例如）的php页面创建新页面

live.json

将每个div内容放入json数组[“content1”，“content2”]

如果php页面的名称没有.json后缀，则需要ajax调用（可以使用ajax jquery函数 - http://api.jquery.com/jQuery.ajax/）来设置将其解释为.json文件。

然后在响应成功时设置回调，并使用for循环将内容放入每个div元素中。

Answer 2

您的问题是单独提出请求。通过每十秒左右将所有请求合并到一个请求中，您将大大提高页面的效率。

您的javascript一次请求并显示所有条目：

var get_entries = function () {
    $.ajax({
        post: true,
        url: "entries.php",
        data: {
            entries: [1, 2, 3, 4, 5, 6, 7, 8]
        },
        success: function (response) {
            var entry_updates = JSON.parse(response);

            for (var entry in entry_updates) {
                $("#UpdateDiv" + entry).html(entry_updates[ entry ]);
            }
        }
    });
};

setInterval(get_entries, 10000);

您的PHP可以同时处理所有条目：

<?php

$entry_updates = array();

if (isset($_POST['entries'])) {
    foreach ($_POST['entries'] as $entry) {
        $entry_updates[ $entry ] = func_get_entry_info($entry);
    }
}

echo json_encode($entry_updates);

使用jquery有效地更新多个div

2 个答案: