php实现进度条的方法

  介绍

小编给大家分享一下php实现进度条的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!

php实现进度条的方法:1,利用“输出缓冲控制”直接输出进度条;2,利用ajax先去请求逻辑处理的地址,然后利用会话或者其他存储介质保存处理进度。

 php实现进度条的方法

php实现进度条主要有两种方式,一种是利用“输出缓冲控制”直接输出进度条,还有一种是ajax方式

该方式主要利用php的几个缓冲函数,该方式可以不用更改配置文件,直接运行即可,下面贴出代码:

& lt; php ?   set_time_limit (0);//设置程序执行时间   ignore_user_abort(真正的);//设置断开连接继续执行   头(& # 39;X-Accel-Buffering:没有# 39;);//关闭缓冲区   头(& # 39;- type: text/html; charset=utf - 8 # 39;);//设置网页编码   ob_start ();//打开输出缓冲控制   回声函数(& # 39;& # 39;1024 * 4);//字符填充   宽度=1000美元;   html=$ & # 39; & lt; div风格=氨Vそ?100 px汽车;填充:8 px;边界:1 px固体灰色;背景:# EAEAEA;宽度:% upx"祝辞& lt; div风格=疤畛?0;背景颜色:白色;边界:1 px固体海军;宽度:% upx"祝辞& lt; div id=皃rogress"风格=疤畛?0;background - color: # FFCC66;边界:0;宽度:0 px;text-align:中心;高度:16 px"祝辞& lt;/div> & lt;/div> & lt; div id=癿sg"风格=白痔謇嘈?大河马字体;字体大小:9 pt;“祝辞正在处理……& lt;/div> & lt; div id=皃ercent"风格=拔恢?相对;前:-34像素;text-align:中心;粗细:大胆的;字体大小:8 pt"在0% % & lt;/div> & lt;/div> & # 39;;   回声sprintf (html、宽度+ 8美元,美元宽度);   回声ob_get_clean ();//获取当前缓冲区内容并清除当前的输出缓冲   冲洗();//刷新缓冲区的内容,输出   长度=11美元;   ($ i=0;i<美元长度;$我+ +){   睡眠(兰德(1、2));   美元比例=($ i + 1)/美元长度;   如果(i + 1==美元长度){   $味精=& # 39;同步完成& # 39;;   其他}{   $味精=& # 39;正在同步第& # 39;。(i + 1美元)。& # 39;个用户& # 39;;   }   $脚本=& # 39;& lt; script> . getelementbyid (“percent") .innerText=? % % u“; . getelementbyid (“progress") .style.width=? upx"; . getelementbyid (“msg") .innerText=? s"; & lt;/script> & # 39;;   回声sprintf($脚本,intval中(比例* 100美元),intval中(($ i + 1)/长度)美元*宽度美元,美元msg);   回声ob_get_clean ();//获取当前缓冲区内容并清除当前的输出缓冲   冲洗();//刷新缓冲区的内容,输出   }

注:该进度条样式是从网上找的,稍微修改了下,你可以替换成自己想要的样式

“ajax方式”则稍微麻烦点,该方法的逻辑是利用ajax先去请求(最好是异步请求)“逻辑处理”的地址,逻辑处理过程中利用会话或者其他存储介质(比如memcache、复述等)保存处理进度,在用ajax去请求(最好是同步请求)另一个查询进度的地址,实现实时反馈

下面贴出代码:
首先是html文件

& lt; !DOCTYPE html> & lt; html> & lt; head> & lt;元charset=癠TF-8"祝辞& lt;脚本类型=拔谋?javascript"src=啊?jquery-1.10.2.min.js"祝辞& lt;/script> & lt; title>同步& lt;/title> & lt;/head> & lt; body>   & lt;输入类型=癰utton"name=皊yn"id=皊yn"值=巴健?/比;   & lt; div id=皃rogressBar"风格=氨Vそ?50 px汽车;填充:8 px;边界:1 px固体灰色;背景:# EAEAEA;宽度:1008 px;显示:none"比;   & lt; div风格=疤畛?0;背景颜色:白色;边界:1 px固体海军;宽度:1000 px"比;   & lt; div id=皃rogress"风格=疤畛?0;background - color: # FFCC66;边界:0;宽度:0 px;text-align:中心;高度:16 px"祝辞& lt;/div>   & lt;/div>   & lt; div id=癿sg"祝辞正在处理……& lt;/div>   & lt; div id=皃ercent"风格=拔恢?相对;前:-18像素;text-align:中心;粗细:大胆的;字体大小:8 pt"在0% & lt;/div>   & lt;/div> & lt;/body> & lt; script>函数查询(时间戳){   . ajax({美元   类型:& # 39;文章# 39;   url: & # 39;/test1.php& # 39;//查询进度   数据:{时间戳:时间戳},   数据类型:“json"   异步:假的,   成功:功能(数据){   如果(data.code==& # 39; 10000 & # 39;) {   data1=data.data;   . getelementbyid (“percent")。innerText=data1实现。% +“%”;   . getelementbyid (“progress") .style.width=data1。进步+“px";   . getelementbyid (“msg") .innerText=data1.msg;如果(data1。%==100){   $ (“# syn") .attr(& # 39;残疾人# 39;,假);返回;   }   其他}{   . getelementbyid (“msg") .innerText=data.msg;   }   setTimeout(& # 39;查询(& # 39;+时间+ & # 39;)& # 39;1000);   }   });   }   $ (“# syn") .click(函数(){   var=日期时间戳。解析(新日期());   $ (“# syn") .attr(& # 39;残疾人# 39;& # 39;残疾人# 39;);   $ (“# progressBar") . css(& # 39;显示# 39;& # 39;块# 39;);   . ajax({美元   类型:& # 39;文章# 39;   url: & # 39;/test.php& # 39;//执行处理   数据:{时间戳:时间戳},   数据类型:“json"   异步:没错,   成功:功能(数据){   如果(data.code==& # 39; 10000 & # 39;) {   console.log(& # 39;同步成功& # 39;);//data1=data.data;//. getelementbyid (“percent")。innerText=data1实现。% +“%”;//. getelementbyid (“progress") .style.width=data1。进步+“px";   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null   null

php实现进度条的方法