Home > Article > Backend Development > Progress bar sample code implemented in php

Progress bar sample code implemented in php

怪我咯Original: 2017-07-23 10:57:232032browse

The progress bar is when the computer is processing a task, it displays the speed of processing the task, the degree of completion, the size of the remaining unfinished tasks, and the possible processing time in the form of pictures in real time. It is usually displayed in a rectangular bar shape. This article mainly introduces the progress bar effect implemented by PHP. It analyzes the function of PHP and JavaScript to dynamically display the percentage progress bar in the form of examples. It involves PHP caching, mathematical operations and JavaScript page element dynamic operation related skills. Friends in need can refer to it. The details are as follows:

<?php
//防止执行超时
set_time_limit(0);
//清空并关闭输出缓存
ob_end_clean();
//需要循环的数据
for($i = 0; $i < 188; $i++)
{
  $users[] = &#39;Tom_&#39; . $i;
}
//计算数据的长度
$total = count($users);
//显示的进度条长度，单位 px 
$width = 500;
//每条记录的操作所占的进度条单位长度
$pix = $width / $total;
//默认开始的进度条百分比
$progress = 0;
?>
<html>
<head>
<title>动态显示服务器运行程序的进度条</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
body,p input {
  font-family: Tahoma;
  font-size: 9pt
}
</style>
<script language="JavaScript">
 <!-- 
 function updateProgress(sMsg, iWidth) 
 { 
  document.getElementById("status").innerHTML = sMsg; 
  document.getElementById("progress").style.width = iWidth + "px"; 
  document.getElementById("percent").innerHTML = parseInt(iWidth / <?php echo $width; ?> * 100) + "%"; 
  } 
 --> 
 </script>
</head>
<body>
  <p style="margin:50px auto; padding: 8px; border: 1px solid gray; background: #EAEAEA; width: <?php echo $width+8; ?>px">
    <p style="padding: 0; background-color: white; border: 1px solid navy; width: <?php echo $width; ?>px">
      <p id="progress"
        style="padding: 0; background-color: #FFCC66; border: 0; width: 0px; text-align: center; height: 16px"></p>
    </p>
    <p id="status"></p>
    <p id="percent"
      style="position: relative; top: -30px; text-align: center; font-weight: bold; font-size: 8pt">0%</p>
  </p> 
<?php
flush(); //将输出发送给客户端浏览器 
foreach($users as $user)
{
  // 在此处使用空循环模拟较为耗时的操作，实际应用中需将其替换； 
  // 如果你的操作不耗时，我想你就没必要使用这个脚本了 :) 
  for($i = 0; $i < 1000000; $i++)
  {
  }
  ?> 
<script language="JavaScript"> 
 updateProgress("正在操作用户 <?php echo $user; ?> ....", <?php echo min($width, intval($progress)); ?>);
</script>
<?php
  flush(); //将输出发送给客户端浏览器，使其可以立即执行服务器端输出的 JavaScript 程序。 
  $progress += $pix;
} //end foreach 
?> 
<script language="JavaScript"> 
  //最后将进度条设置成最大值 $width，同时显示操作完成 
 updateProgress("操作完成！", <?php echo $width; ?>); 
</script>
<?php
flush();
?>
</body>
</html>

The above is the detailed content of Progress bar sample code implemented in php. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：PHP mcrypt() reversible encryption algorithm analysisNext article：PHP mcrypt() reversible encryption algorithm analysis

See more

Progress bar sample code implemented in php

Related articles