PHP Curl进度条（回调返回百分比）

我已经使用以下方法实现了curl进度条

curl_setopt($curl, CURLOPT_PROGRESSFUNCTION, 'callback');

curl_setopt($curl, CURLOPT_BUFFERSIZE,64000);

curl_setopt($curl, CURLOPT_FOLLOWLOCATION, true);

和一个回调函数。

问题是，脚本每次都会在我的 html 上输出百分比，如下所示：

0
0.1
0.2
0.2
0.3
0.4
..
..
..
1
1.1

我如何将其与 CSS 结合起来显示不断变化的进度条？

假设您有一个进度条 HTML：

<div id="progress-bar">
    <div id="progress">0%</div>
</div>

CSS:

#progress-bar {
    width: 200px;
    padding: 2px;
    border: 2px solid #aaa;
    background: #fff;
}

#progress {
    background: #000;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    padding: 5px 0;
    text-indent: 5px;
    width: 0%;
}

和 JavaScript：

var progressElement = document.getElementById('progress')

function updateProgress(percentage) {
    progressElement.style.width = percentage + '%';
    progressElement.innerHTML = percentage + '%';
}

您可以让它输出 JavaScript 并让它为您更新进度条，例如：

<script>updateProgress(0);</script>
<script>updateProgress(0.1);</script>
<script>updateProgress(0.2);</script>
..
..

请注意，您不能将每个更新都放入separate脚本块，因为浏览器会在执行之前尝试读取完整的脚本，并且进度条将不起作用。