首頁 後端開發 php教程 PHP实现的进度条效果详解_PHP

PHP实现的进度条效果详解_PHP

May 28, 2016 am 11:45 AM
php 進度條

本文实例讲述了PHP实现的进度条效果。分享给大家供大家参考,具体如下:
在做采集的时候,想通过php来实现一个进度条功能,谷歌了一下,找了个合适的代码。下面直接上代码:

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

登入後複製

更多关于PHP相关内容感兴趣的读者可查看本站专题:《PHP数组(Array)操作技巧大全》、《PHP数学运算技巧总结》、《php正则表达式用法总结》、《PHP+ajax技巧与应用小结》、《PHP运算与运算符用法总结》、《PHP网络编程技巧总结》、《PHP基本语法入门教程》、《php日期与时间用法总结》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家PHP程序设计有所帮助。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

適用於 Ubuntu 和 Debian 的 PHP 8.4 安裝和升級指南 適用於 Ubuntu 和 Debian 的 PHP 8.4 安裝和升級指南 Dec 24, 2024 pm 04:42 PM

適用於 Ubuntu 和 Debian 的 PHP 8.4 安裝和升級指南

CakePHP 專案配置 CakePHP 專案配置 Sep 10, 2024 pm 05:25 PM

CakePHP 專案配置

CakePHP 日期和時間 CakePHP 日期和時間 Sep 10, 2024 pm 05:27 PM

CakePHP 日期和時間

CakePHP 檔案上傳 CakePHP 檔案上傳 Sep 10, 2024 pm 05:27 PM

CakePHP 檔案上傳

CakePHP 路由 CakePHP 路由 Sep 10, 2024 pm 05:25 PM

CakePHP 路由

討論 CakePHP 討論 CakePHP Sep 10, 2024 pm 05:28 PM

討論 CakePHP

如何設定 Visual Studio Code (VS Code) 進行 PHP 開發 如何設定 Visual Studio Code (VS Code) 進行 PHP 開發 Dec 20, 2024 am 11:31 AM

如何設定 Visual Studio Code (VS Code) 進行 PHP 開發

CakePHP 快速指南 CakePHP 快速指南 Sep 10, 2024 pm 05:27 PM

CakePHP 快速指南

See all articles