首页 文章

逐步上传页面内容（不必等到加载所有内容）

提问于
浏览 次
2

我有一个显示10个不同项目的页面，每个项目需要一段时间才能加载 .

目前，页面必须等到完全加载所有10个项目才能显示网页 . 我想知道，一旦加载，是否可以在网页上显示这些项目？无需等待其余部分满载 .

一个数组包含所有10个项目，并通过迭代它，显示每个项目（注意：假设显示这些项目，即加载它们需要一段时间）这只是一个简化的场景来实现这个想法：

<html>
<body>
<?php

$array = array("item1", "item2", "item3", "item4","item5", "item6", "item7", "item8","item9", "item10");

foreach ($array as $value) {
    // Here..do calculations (which is time-consuming and must be done using php) before building the HTML for each item/value in the array
    echo "<div class='display'>";
    echo "<h1>".$value."</h1>";
    echo "</div>";
    }
?>
</body>
</html>

换句话说，是否可以显示网页，并在收到内容后立即更新内容？

javascript php jquery html server

2 回答

  • 1

    由于您对每个项目进行了大量计算，因此最好将此代码移至javascript . PHP是一个预处理器，所以如果你在HTML中使用它，它的所有工作都必须在页面呈现之前完成 .

    首先，使用一个空容器创建您的页面，其中将有条目 . 这将允许页面立即加载而无需等待条目处理 .

    接下来，您需要收集条目的数据 . 如果数据来自数据库，请编写一个PHP服务，该服务返回您要加载的一系列条目的数据 . 从jQuery调用PHP服务并使用响应填充javascript数组 . 如果数据是静态的而不是来自数据库，您可以自己编写JS数组 .

    获得数据数组后，可以启动一个循环来遍历每个数据并对其进行处理，然后使用jQuery将其附加到HTML中 .

    这样，用户立即加载页面，您的条目将在可用时显示 . 给某种加载微调器指示用户即将发生的事情也是一个好主意 . 如果您需要在不中断用户体验的情况下检索其他条目，此方法还允许您从jQuery返回到PHP服务 .

    回复于
  • 0

    您可以加载没有项目的页面，并使用jquery加载每个项目

    $(document).ready(function() {
     //iterate through array and load each item one by one
});

    要么

    $(window).load(function() {
    //iterate through array and load each item one by one
})
    回复于

相关问题