javascript 解析时的 PHP 和 jQuery 进度条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18566362/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
PHP and jQuery progress bar while parsing
提问by Username
I was wondering how I could go about making a progress bar for parsing HTML data. Essentially the user searches something and I parse another website. I tried doing it with getting the amount of objects found in an array then dividing 100 by it, and getting the current one in a for loop and multiplying it by 100/total. Then I would update a text file with the value. Then update the progress bar with that value. However, I want a more efficient way to do it. Also it has to be unique to each user. Thanks.
我想知道如何制作用于解析 HTML 数据的进度条。本质上，用户搜索某些内容，然后我解析另一个网站。我尝试通过获取数组中找到的对象数量然后除以 100，然后在 for 循环中获取当前对象并将其乘以 100/total 来实现。然后我会用该值更新一个文本文件。然后使用该值更新进度条。但是，我想要一种更有效的方法来做到这一点。此外，它必须对每个用户都是唯一的。谢谢。
回答by Username
I found another way to do it, this is to help all of those people that have the same question. I found it out on here http://w3shaman.com/article/php-progress-bar-script
我找到了另一种方法，这是为了帮助所有有相同问题的人。我在这里找到了http://w3shaman.com/article/php-progress-bar-script
<?php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
<title>Progress Bar</title>
</head>
<body>
<!-- Progress bar holder -->
<div id="progress" style="width:500px;border:1px solid #ccc;"></div>
<!-- Progress information -->
<div id="information" style="width"></div>
<?php
// Total processes
$total = 10;
// Loop through process
for($i=1; $i<=$total; $i++){
// Calculate the percentation
$percent = intval($i/$total * 100)."%";
// Javascript for updating the progress bar and information
echo '<script language="javascript">
document.getElementById("progress").innerHTML="<div style=\"width:'.$percent.';background-color:#ddd;\"> </div>";
document.getElementById("information").innerHTML="'.$i.' row(s) processed.";
</script>';
// This is for the buffer achieve the minimum size in order to flush data
echo str_repeat(' ',1024*64);
// Send output to browser immediately
flush();
// Sleep one second so we can see the delay
sleep(1);
}
// Tell user that the process is completed
echo '<script language="javascript">document.getElementById("information").innerHTML="Process completed"</script>';
?>
</body>
</html>
?>
回答by user3393366
Executing length php process while showing progress, even having multiple progress barson same page and pre/post hooks: http://pastebin.com/KSxjC01r
在显示进度的同时执行长度 php 进程，甚至在同一页面上有多个进度条和前/后挂钩：http: //pastebin.com/KSxjC01r
I've done it for myself, because I need it.
我已经为自己做了，因为我需要它。
Feel free to use it.
随意使用它。
回答by Krasimir
If you use PHP for the parsing part then this means that you should somehow get information from that process. This also means that you have to (probably) make ajax requests to another php script which monitors the first one or at least gets some log information from it. I don't think that PHP is the right choice for that. I'll suggest to use nodejs. There, you are able to implement real time socket communication, which is kinda easy.
如果您将 PHP 用于解析部分，那么这意味着您应该以某种方式从该过程中获取信息。这也意味着您必须（可能）向另一个监控第一个脚本的 php 脚本发出 ajax 请求，或者至少从中获取一些日志信息。我不认为 PHP 是正确的选择。我会建议使用nodejs。在那里，您可以实现实时套接字通信，这很容易。
回答by shipmodeller
I've used the solution user3393366 put forth in a post above, and though it outputs an ugly amount of javascript code, it worked real well. I modified it to put out multicolor progress bars based on percentage complete, fixed the multi progress bars on a page issue, added titles to the progress bars, and made optional hide progress bars at completion functions.. so, no jquery or ajax needed, and works well.. be more than willing to post my mods here.. Sure, maybe not cutting edge stuff.. but gets the job done.
我使用了上面帖子中提出的解决方案 user3393366，虽然它输出了大量的 javascript 代码，但它运行得非常好。我修改了它以基于完成百分比推出多色进度条，修复页面问题上的多进度条，为进度条添加标题，并在完成功能中设置可选的隐藏进度条..所以，不需要 jquery 或 ajax，并且效果很好......非常愿意在这里发布我的模组......当然，也许不是最前沿的东西......但可以完成工作。
