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

发布于 2024-10-12 13:45:24 字数 354 浏览 5 评论 0原文

实现了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 结合起来以显示变化的进度条？

原文

I have implemented the curl progress bar using

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

curl_setopt($curl, CURLOPT_BUFFERSIZE,64000);

curl_setopt($curl, CURLOPT_FOLLOWLOCATION, true);

and a callback function.

problem is, the script is outputting the percentage on my html everytime like this :

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

How do i combine this with CSS to show a changing progress bar ?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

山田美奈子 2024-10-19 13:45:24

假设您有一个进度条 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>
..
..

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

Suppose you have a progress bar 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%;
}

And JavaScript:

var progressElement = document.getElementById('progress')

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

You can have it output JavaScript and have it update the progress bar for you, for example:

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

Note that you can't put each update in separate script block, because the browser will try to read the full script before executing and the progress bar will not work.

回复收藏 0 原文

~没有更多了~