PHP实现的进度条效果详解

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

<?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;
?>
<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 / <?php echo $width; ?> * 100) + "%";
  }
 -->
 </script>
</head>
<body>
  <div style="margin:50px auto; padding: 8px; border: 1px solid gray; background: #EAEAEA; width: <?php echo $width+8; ?>px">
    <div style="padding: 0; background-color: white; border: 1px solid navy; width: <?php echo $width; ?>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>
<?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>

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

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

(0)

相关推荐

  • PHP 文件上传进度条的两种实现方法的代码

    目前我知道的方法有两种,一种是使用PHP的创始人 Rasmus Lerdorf 写的APC扩展模块来实现(http://pecl.php.net/package/apc),另外一种方法是使用PECL扩展模块 uploadprogress实现(http://pecl.php.net/package/uploadprogress)我这里举两个分别实现的例子供参考,更灵活的应用根据自己需要来修改. APC实现方法: 安装APC,参照官方文档安装,可以使用PECL模块安装方法快速简捷,这里不说明 配置p

  • PHP 进度条函数的简单实例

    PHP 进度条函数的简单实例 其实进度条的做法很简单的.网上的一大堆,自己写了一个,哈哈,感觉看起来很有感觉. 实例代码: function ShowPercent($now,$total) { $percent = sprintf('%.0f',$now*100/$total); $html = '<table width="60%" style="border-collapse:separate" height="10" border=

  • PHP中使用Session配合Javascript实现文件上传进度条功能

    Web应用中常需要提供文件上传的功能.典型的场景包括用户头像上传.相册图片上传等.当需要上传的文件比较大的时候,提供一个显示上传进度的进度条就很有必要了. 在PHP 5.4以前,实现这样的进度条并不容易,主要有三种方法: 1.使用Flash, Java, ActiveX 2.使用PHP的APC扩展 3.使用HTML5的File API 第一种方法依赖第三方的浏览器插件,通用性不足,且易带来安全隐患.不过由于Flash的使用比较广泛,因此还是有很多网站使用Flash作为解决方案. 第二种方法的不足

  • php+ajax实现带进度条的大数据排队导出思路以及源码

    废话不多说,先上效果图: 点击导出,实现 点击导出 统计完成之后 点击确定 下面来谈谈实现的思路: 前面导出操作简单,从第二个导出操作开始: 点击"确定"调用exportCsv函数 复制代码 代码如下: <a class="on" href="javascript:exportCsv();"><em>导出</em></a> exportCvs函数如下function exportCsv(){ //清

  • php 进度条实现代码

    复制代码 代码如下: <html> <head> </head> <body> <table width="400" border="0" cellspacing="1" cellpadding="1"> <tr> <td bgcolor="000000"> <table width="400" b

  • PHP+FLASH实现上传文件进度条相关文件 下载

    PHP之所以很难实现上传进度条是因为在我们上传文件到服务器的时候,要等到文件全部送到服务器之后,才执行相应的php文件.在这之前,文件数据保存在一个临时文件里面,而php无法获得这个文件的路径及大小.      从Actionscript 2.0开始,Flash支持文件上传及下载了.虽然不能在服务端获得文件上传进度,但我们可以在服务端获得文件的发送进度.根据这个原理,用Flash就能做出上传进度条效果.      我在网上看到过一些资料,但是感觉有缺陷.于是自己研究了一下,在前人的基础上加强了程

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

    本文实例讲述了PHP实现的进度条效果.分享给大家供大家参考,具体如下: 在做采集的时候,想通过php来实现一个进度条功能,谷歌了一下,找了个合适的代码.下面直接上代码: <?php //防止执行超时 set_time_limit(0); //清空并关闭输出缓存 ob_end_clean(); //需要循环的数据 for($i = 0; $i < 188; $i++) { $users[] = 'Tom_' . $i; } //计算数据的长度 $total = count($users); //

  • Android自定义进度条的圆角横向进度条实例详解

    1.本文将向你介绍自定义进度条的写法,比较简单,但还是有些知识点是需要注意的: invalidate()方法 RectF方法的应用 onMeasure方法的应用 2.原理 画3层圆角矩形,底层为黑色,第二层为灰色,最上一层为进度条颜色,示例图如下: 3.效果图   实现圆角进度条还有很多其他方法,比如在Progress控件里填充圆角图片,通过拉伸图片来达到预想的效果,虽然听起来很简单,但实现起来还是有些麻烦的. 4.解说方法 (1)invalidate()方法 invalidate()是用来刷新

  • Android Webview添加网页加载进度条实例详解

    推荐阅读:Android WebView线性进度条实例详解 最近在android项目中使用webview嵌套了一个抽奖活动网页,活动上线,运行良好(改了N次需求和突发bug),还好这种模式的活动,只需要修改网页,不需要重新打包发布市场,这也是这种模式开发的优势之一.后来据产品哥反馈说加载网页无进度提示,好吧,这个当时真没考虑这么多,这个要加加..想当然以为轻松搞定之....其实还是比轻松要复杂点... 1.首先自定义一个WebView控件 /** * 带进度条的Webivew * @author

  • Android WebView线性进度条实例详解

    推荐阅读:Android Webview添加网页加载进度条实例详解 先给大家展示下效果图:这个效果图大家一看就懂,在生活经常见到 1.wevbview_progressbar.xml <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 背景 --> <item android:id="@android:id/background"&g

  • Android ProgressDialog进度条使用详解

    进度条以一种客观化的方式,让我们知道程序正在执行的情况,在程序需要时间执行任务的时候,提示进度条友好的告诉用户说,当前任务还没有完成,请稍稍等待,进度条经常使用在APP下载应用.更新应用.加载网络数据中,使用频繁,常见的进度条有ProgressDialog.ProgressBar,这里只要介绍ProgressDialog. ProgressDialog读取文件进度解析主要涉及到一个知识: Handler消息处理机制, 文件字节流的操作, ProgressDialog类的使用 1.Handler消

  • Android 进度条使用详解及示例代码

    在这里,总结一下loading进度条的使用简单总结一下. 一.说起进度条,必须说说条形进度条,经常都会使用到嘛,特别是下载文件进度等等,还有像腾讯QQ安装进度条一样,有个进度总给人良好的用户体验. 先来找图看看,做这个图完成不用图片就可以做到了. 看下xml布局文件,其实就是直接用xml写的在加两个属性设置一下就好了,一个style,另一个是background. <ProgressBar android:id="@+id/pb_progressbar" style="

  • Android ProgressBar进度条使用详解

    ProgressBar进度条,分为旋转进度条和水平进度条,进度条的样式根据需要自定义,之前一直不明白进度条如何在实际项目中使用,网上演示进度条的案例大多都是通过Button点击增加.减少进度值,使用方法incrementProgressBy(int),最简单的做法是在xml布局文件中放置ProgressBar空间,然后再MainActivity中触发事件后执行incrementProgressBy(int),代码如下: <LinearLayout xmlns:android="http:/

  • iOS如何自定义步骤进度条实例详解

    前言 最近新项目要做入驻功能,其中包括一个入住流程,类似登录或者注册流程如下图. 之前想着用自己绘图来做,可是又懒不想多写代码,所以就想着能不能用进度条来做. 实现方法如下: 1.用进度条做的首先要解决的是进度条的高度问题,可以通过仿射变换来扩大高度. progressView.transform = CGAffineTransformMakeScale(1.0f,2.0f); 2.用进度条要设置进度progress要与按钮对应 通过步骤的索引来改变进度的值和按钮的图片.由于按钮的左右有间隔所以

  • Bootstrap实现各种进度条样式详解

    一:默认的进度条 创建一个基本的进度条的步骤如下: 添加一个带有 class .progress 的 <div>. 接着,在上面的 <div> 内,添加一个带有 class .progress-bar 的空的 <div>. 添加一个带有百分比表示的宽度的 style 属性,例如 style="60%"; 表示进度条在 60% 的位置. 让我们看看下面的实例: <!DOCTYPE html> <html> <head>

  • Linux下模拟实现进度条实例详解

    Linux下模拟实现进度条 在Linux系统下模拟进度条,首先需要了解一些简单基础知识: 1.在Linux系统下,\r是回车符,\n是换行符,回车是行不变光标回到该行的起始位置,换行是跳转到下一行,但是光标位置不变: 2.C\C++的输入输出都有缓冲区,都为行缓冲,行刷新,通过回车换行刷新到I\O区: 3.1秒 = 1*10的三次方毫秒 = 1*10的6次方微秒 Linux下c代码实现: 编写Makefile: 代码运行结果: 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

随机推荐