我有两个 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>