显示部分页面，然后插入需要一段时间才能完成的函数的输出

Question

我需要在从函数输出内容之前显示页面的大部分内容。该函数需要一段时间才能执行，并且 returns 页面的一些内容。我需要先显示页面的其余部分，然后运行函数，然后 'insert' 函数输出。

我似乎需要在函数的开头使用 ob_start，然后将该数据存储在带有 ob_get_content() 的变量中。但我还需要运行在页面的其余部分显示后执行此功能。

这是我尝试过但没有成功的一些代码（这是 body 标签内的内容区域）：

<div id='part1'>
   <p>here is part 1 of the content</p>
</div>
<div id='part2'> // this is where the function output will be inserted after processing it
   <p>part 2</p>
<?php echo long_function();?>
</div>
<div id='part3'>
   <p>this is part 3 of the content
</div>

<?php
function long_function() {
   // some process that takes a long time to get data
   // and stores it in the $part2_content
   return $part2_content;
}

结果应该是第 1 部分和第 3 部分 div 内容应该显示。然后，当 long_function() 完成收集数据时，该数据应该在 'part2' 部分输出。

我尝试在 long_function() 的开头放置一个 ob_start()，然后 $part2_content = ob_get_contents() 来存储输出数据（没有 ob_flush）。

我认为我可能需要在 'part2' ID 中添加某种 DOM 'write'，但不确定要完成的正确组合。

Answer 1

基于这个完全可以接受的答案：

PHP is a server-side programming language. It gets executed when you request a page. So you cannot execute it after the page has been loaded. If you need to check if something has loaded on the client side, you'll have to use a client-side programming language like JavaScript.

我建议您将此 long_function 放在另一条路线中，并在加载页面期间（或之后）使用 Ajax 请求它。

Answer 2

我相信你不能做服务器端渲染。 php 是后端语言，即运行 hole 脚本文件，然后最后薄打印输出

例如：在一个函数中：你不能 return 然后在

之后调用代码

function sayHi(){
    $word = 'hi';
    return "bye";
    echo $word; // this code will never work :) 
}

懒惰？

所以需要使用Clint端渲染

例如使用ajax

AJAX stands for Asynchronous JavaScript and XML. AJAX is a new technique for creating better, faster, and more interactive web applications with the help of XML, HTML, CSS, and Java Script.

Answer 3

根据提供的答案和链接（以及记住 PHP 是服务器端的，因此在呈现页面后无法更改内容），我想出了这段适用于我的代码目的。根据需要把<some-page-on-your-site>改成你想获取的页面。

我包含了一个仅 CSS 的微调器，这样您就可以在 Ajax 请求工作时观看一些东西。

<!DOCTYPE html>
<html>
    <head>
<style>
/* for the loading spinner  */
#spinner {
    display:none;
    position: fixed;
    margin: auto;
    width: 30%;
    background-color: white;
    top:40%;
    left:30%;
    border:thin solid darkblue;
}
.spinner {
 border: 8px solid gray;
    border-radius: 50%;
    border-top: 8px solid green;
    border-right: 8px solid lightgreen;
    border-bottom: 8px solid green;
    border-left: 8px solid lightgreen;
    width: 30px;
    height: 30px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}
.spinner_book {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    overflow: hidden;
    transition-duration: 0.8s;
    transition-property: transform;
}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
</style>

    </head>
<body onload='loadDoc()'>
    <div>
        <div id='ajax_results'>
            <div align='center'>
                <p align='center' class='spinner'></p>
                <p align='center'>Please wait we get the data ...</p>
            </div>
        </div>
    </div>
<script>
function loadDoc() {
    const xhttp = new XMLHttpRequest();
    xhttp.onload = function() {
        document.getElementById("ajax_results").innerHTML = this.responseText;
        }
    xhttp.open("GET", "<some-page-on-your-site>");
    xhttp.send();
}
</script>

</body>
</html>

您可以将查询参数添加到 <some-page-on-your-site> .

请注意，'ajax_results' div（微调器和消息）中的初始文本将被请求的内容替换。因此在请求完成后无需删除微调器。

感谢帮助我找到解决方案的答案。我希望这能帮助到这里徘徊的其他人。

显示部分页面，然后插入需要一段时间才能完成的函数的输出

Show partial page and then insert output from a function that takes a while to finish

php

flush

懒惰？