0

我有两个 php 页面。page.php 和 loader.php。Loader.php 从 mysql 中提取数据以填充进度条,而 page.php 包含一个每秒刷新 loader.php 的函数。它可以工作,但它相当难看,因为你可以看到 CSS 动画每秒都在重置。

我更喜欢在 page.php 中使用加载栏 html 以及我的页面的所有其他 html,但是 A)我如何将 loader.php 中的 vars 获取到 page.php 和 B)我如何更新 div(或任何对象)在 page.php 上而不刷新页面?

我研究了 AJAX,它似乎可以做我想做的事,但我对 AJAX 和一般编程很陌生。我已经为它(在某种程度上)开始工作而感到自豪。

页面.php

<script>
var myTimer = null;

//executes a script that fills mysql with data
function fileExec() {
        $.ajax({
            url:"fileexec.php",
            type: "post"
        });
    startRefresh();
}

//Shows progress bar
function refreshData() {
  $('#container').load('loader.php');
}

function stopRefresh() {
  clearInterval(myTimer);
}

function startRefresh() {
 myTimer = setInterval(refreshData, 1000);
}

</script>

加载器.php

<?php
//Code not shown sets up connection to mysql to pull progress
$progress1 = $row['progress'];
$script1 = $row['script'];

//Stop refresh after shell script has finished
if ($script1 == "stop") {
    echo "<script>";
    echo "stopRefresh();";
    echo "</script>";
}
?>

//Update progress bar with variable
<html>
  <body>
    <div class="progress-bar-wrapper">
        <div class="progress-bar">
            <div id="myBar" class="progress-bar-fill in-progress" style="height:10px;width:<?php echo $progress1; ?>%"></div>
         </div>
    </div>
  </body>
</html>
4

1 回答 1

1

使用 js 更新它:

$.post("loader.php", {
        function: "getProgress"
        }, function(data) {
            progress = JSON.parse(data);
            //use progress to change your bar with js
        });

在php中:

switch ($_POST['function']) {
    case 'getProgress':
        getProgress();
    break;
}
function getProgress() {
    //get the progress state
    echo json_encode($progress);
}
于 2020-09-03T08:43:39.890 回答