Question

我有一个页面，其中包含从db检索到的各种信息块。这些块被分成几个部分，目前所有代码都有一个很长的PHP页面，所以每次加载一个页面时，它的显示都有延迟。我希望能够更快地加载页面并在加载内容的部分中放置某种“loading ...”或图像占位符。我在其他网站上经常看到它。我该如何做到这一点？我是否需要将我长篇PHP页面分解为：

主要布局页面
将包含db数据的每个块放入单独的页面，并
使用include插入主页面。

在生成内容时如何进行“加载”？

只是想更好地了解这个过程。我也使用jQuery。也许有一个可以帮助解决的问题？

感谢。

Answer 1

在您的主布局页面中仅包含您希望在页面最初加载时可见的元素。您应该有占位符元素，其ID可以通过JavaScript访问，您希望从服务器获取内容。

使用jQuery的ajax函数将内容从单独的请求加载到服务器：

$.ajax({
    url: '/path/to/script.php',
    data: 'any=get&variables=you&would=like&to=set', // can also be passed as an object
    success: function( html ) {
        // The argument passed to the success function is ALL of the output 
        // of your 'script.php'
        $('#containerid').html( html );

    }
});

在您的后端PHP脚本中，只需echo输出您要显示的内容即可。您可以选择将内容作为JSON对象传回，这是一种更优选的方法，但需要在客户端进行更多处理（必须首先解析该对象才能使用它。请参阅PHP的json_encode函数和{{ 3}}有关JSON的更多信息。

以这种方式结构化，我最有意义的是每个容器要填充1个ajax请求。

请查看JSON.org了解jQuery的ajax功能

Answer 2

由于你正在使用jQuery，显而易见的方法是让PHP脚本构建一个框架页面然后使用javascript函数（Ajax）来加载页面的不同部分，甚至可以在块中执行，因此只有部分每次加载部分。

Answer 3

您可以使用页面布局构建一个php文件。在此文件中使用AJAX从所有块加载数据。您可以使用jQuery进行AJAX调用。

当你执行ajax调用时，你可以放一些动画gif“正在加载...”，如果你搜索谷歌“加载gif”，有很多它们。

希望它有所帮助。

加载结果时显示占位符

3 个答案: