ajaxphp上传进度条

❶ thinkphp3.2.3上传文件显示进度

因为上述操作包含了上传文件的操作，而普通ajax无法实现文件上传，经过网络有使用FormData对象与插件这两种方法，详见前一篇转载的博文，于是我就尝试了一下FormData对象的方法。
情景：我要利用thinkPHP3.2.3框架实现增加商品时对其输入数漏桥据合法性的验证之后到前台提示如搜首，一开始是通过内置的跳转函数实现的跳转提示，会跳到一个页面显示再返回，这样给人的视觉体验很不好，于是想修改为ajax方式来实现异步更渣数新数据而不刷新此页面，也不离开此页面，而是通过alert弹出警告框来提示用户输入数据的合法性与否。因为商品的表单数据中包含文件，所以一开始使用ajax时使用jquery内置的收集数据的方法：$("form").serialize(); 但是它不支持文件数据的收集，于是网络后就尝试使用FormData加上ajax来实现表单的异步提交并实现文件的上传。
首先在控制器就要修改执行成功或失败时的跳转函数，如

$this->success('添加成功！',U('listGoods'),true);
$this->error('添加失败！',U('add'),true);
细心的同学应该发现了跟以前写的有不同之处吧，就是多给了一个参数，默认是false,设置为true时表明表单是使用ajax提交的，从而不执行跳转，而是返回json格式的数据如下：

{"info":"\u6dfb\u52a0\u6210\u529f\uff01","status":1,"url":"\/shop\/index.php\/Admin\/Goods\/listGoods.html"}
{"info":"\u6dfb\u52a0\u6210\u529f\uff01","status":0,"url":"\/shop\/index.php\/Admin\/Goods\/listGoods.html"}
这样就可以在前台的ajax执行的success回调函数内部获取数据，status=1表示成功，status=0表示失败。
一开始使用的方法代码如下：

function testAjax(){
var formData = new FormData(document.getElementById("addForm"));
$.ajax({
url:"__SELF__",
type:"post",
data:formData,
dataType: 'json',
processData:false,// 告诉jQuery不要去处理发送的数据
contentType:false,// 告诉jQuery不要去设置Content-Type请求头
success:function(data){
window.clearInterval(timer);
console.log("over...");
//判断是否添加成功
if(data.status == 1){
alert(data.info);
location.href = data.url;
}
else{
alert(data);
}

},
error:function(e){
alert("错误");
window.clearInterval(timer);
}
});
get();//此处为上传文件的进度条
}
正常情况下是不跳转的，但是我猜应该是使用了FormData对象的缘故，导致ajax执行回调函数后，一直自行跳到一个空白界面显 示返回的json格式的提示信息。这样的效果显然不是我要的，于是就开始测试，看到底是哪里出错了，最后发现确实没法控制它， 正一筹莫展时突然发现现在使用的是绑定了提交按钮的onclick事件，我猜会不会是这个原因，反正改一下也没关系，于是将其改成 限制通过按钮提交表单的方法来实现果然不自行跳转了，真的激动啊！！这时明白最关键原因应该跟FormData无关了，其实就是提 交方式的原因导致的。

❷ php 文件上传，如何实现进度条功能

用flash文件上传插件
如：http://ke..com/view/1332553.html?wtp=tt
php创始者也写了一个php的扩展可以实现，麻烦，不如flash上传插件简单，qq，的相册都用flash传

❸ PHP进度条

解决思路：

任务分两种，一个是总进度，也就是任务队列，用一个array保存起来

还有一个就是任务的进度，如，当前任务完成了多少

用一个参数来指示当前进度，如currentTask，再用两个参数来指示当前正在执行任务的任务进度，比如导出数据，用begin和end来表示当前导出的是从begin到end之间的记录数

每次任务执行完之后再把begin和end同时在加上增量，再让浏览器跳转一下，这样就可以调到下一步继续执行了，每当在执行当前任务结束时，将CurrentTask向后指示，继续任务队列中的任务

以上用到的参数都是用querystring来保存的，包括任务队列信息，也可以用临时文件来保存

❹ 在php中,如何应用ajax实现等待进度条功能

jquery 有好多进度条方式的效果的。。你可以参考。

❺ PHP 如何用ajax做文件上传

通过传统的form表单提交的方式上传文件：
[html] view plain 在CODE上查看代码片派生到我的代码片<form id= "uploadForm" action= "http://localhost:8080/cfJAX_RS/rest/file/upload" method= "post" enctype ="multipart/form-data">
<h1 >测试通过Rest接口上传文件 </h1>
<p >指定文件名： <input type ="text" name="filename" /></p>
<p >上传文件： <input type ="file" name="file" /></p>
<p >关键字1： <input type ="text" name="keyword" /></p>
<p >关键字2： <input type ="text" name="keyword" /></p>
<p >关键字3： <input type ="text" name="keyword" /></p>
<input type ="submit" value="上传"/>
</form>
不过传统的form表单提交会导致页面刷新，但是在有些情况下，我们不希望页面被刷新，这种时候我们都是使用Ajax的方式进行请求的。
Ajax的方式进行请求：
[javascript] view plain 在CODE上查看代码片派生到我的代码片$.ajax({
url : "http://localhost:8080/STS/rest/user",type : "POST",
data : $( '#postForm').serialize(),
success : function(data) {
$( '#serverResponse').html(data);
},
error : function(data) {
$( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);}
});
通常我们提交（使用submit button）时，会把form中的所有表格元素的name与value组成一个queryString，提交到后台。这用jQuery的方法来说，就是serialize。
通过$('#postForm').serialize()可以对form表单进行序列化，从而将form表单中的所有参数传递到服务端。
但是上述方式，只能传递一般的参数，上传文件的文件流是无法被序列化并传递的。
不过如今主流浏览器都开始支持一个叫做FormData的对象，有了这个FormData，我们就可以轻松地使用Ajax方式进行文件上传了。
关于FormData及其用法
FormData是什么呢？我们来看看Mozilla上的介绍。
XMLHttpRequest Level 2添加了一个新的接口FormData.利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()方法来异步的提交这个"表单".比起普通的ajax,使用FormData的最大优点就是我们可以异步上传一个二进制文件.
所有主流浏览器的较新版本都已经支持这个对象了，比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。
参见：https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/FormDataConstructor
FormData()
想得到一个FormData对象：
var formdata = new FormData();
W3c草案提供了三种方案来获取或修改FormData。
方案1：创建一个空的FormData对象，然后再用append方法逐个添加键值对：
var formdata = new FormData();
formdata.append("name", "呵呵");
formdata.append("url", "http://www..com/");方案2：取得form元素对象，将它作为参数传入FormData对象中！
var formobj = document.getElementById("form");var formdata = new FormData(formobj);
方案3：利用form元素对象的getFormData方法生成它！
var formobj = document.getElementById("form");var formdata = formobj.getFormData()
Method
FormData.append
本方法用于向已存在的键添加新的值，如该键不存在，新建之。
语法
formData.append(name, value);
formData.append(name, value, filename);
注: 通过 FormData.append()方法赋给字段的值若是数字会被自动转换为字符(字段的值可以是一个Blob对象,一个File对象,或者一个字符串,剩下其他类型的值都会被自动转换成字符串).
参数解释
name
键 (key)， 对应表单域
value
表单域的值
filename (optional)
The filename reported to the server (a USVString), when a Blob or File is passed as the second parameter. The default filename for Blob objects is "blob".
FormData.delete
将一对键和值从 FormData 对象中删除。
formData.delete(username);
FormData.get
返回给定键的第一个值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.get(username); // "Justin"
FormData.getAll
返回给定键的所有值
formData.append('username', 'Justin');
formData.append('username', 'Chris');
formData.getAll(username); // ["Justin", "Chris"]
FormData.has
检查是否包含给定键，返回 true 或 false
formData.has(username);
FormData.set
设置给定键的值
formData.set(name, value);
formData.set(name, value, filename);
浏览器兼容情况
来自 MDN：
Desktop
FeatureChromeFirfox(Gecko)Intenet ExplorerOperaSafariBasic support7+4.0(2.0)10+12+5+
append with filename(Yes)22.0(22.0)???
delete, get, getAll, has, setBehind FlagNot supportedNot supported(Yes)Not supportedMobile
FeatureAndroidChrome AndroidFirfox Mobile (Gecko)Firfox OS (Gecko)IE MobileOpera MobileSafari MobileBasic support3.0?4.0(2.0)1.0.1?12+?
append with filename??22.0(22.0)1.2???
delete, get, getAll, has, set(Yes)(Yes)Not supportedNot supportedNot supported(Yes)Not supported2015年06月04日发布
Ajax通过FormData上传文件
1.使用<form>表单初始化FormData对象方式上传文件HTML代码
<form id="uploadForm" enctype="multipart/form-data">
<input id="file" type="file" name="file"/>
<button id="upload" type="button">upload</button>
</form>
javascript代码
$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: new FormData($('#uploadForm')[0]),
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
这里要注意几点：
processData设置为false。因为data值是FormData对象，不需要对数据做处理。
<form>标签添加enctype="multipart/form-data"属性。
cache设置为false，上传文件不需要缓存。
contentType设置为false，不设置contentType值，因为是由<form>表单构造的FormData对象，且已经声明了属性enctype="multipart/form-data"，所以这里设置为false。
上传后，服务器端代码需要使用从查询参数名为file获取文件输入流对象，因为<input>中声明的是name="file"。
如果不是用<form>表单构造FormData对象又该怎么做呢？
2.使用FormData对象添加字段方式上传文件
HTML代码
<div id="uploadForm">
<input id="file" type="file"/>
<button id="upload" type="button">upload</button>
</div>
这里没有<form>标签，也没有enctype="multipart/form-data"属性。
javascript代码
var formData = new FormData();
formData.append('file', $('#file')[0].files[0]);$.ajax({
url: '/upload',
type: 'POST',
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});
这里有几处不一样：
append()的第二个参数应是文件对象，即$('#file')[0].files[0]。
contentType也要设置为‘false’。
从代码$('#file')[0].files[0]中可以看到一个<input type="file">标签能够上传多个文件，只需要在<input type="file">里添加multiple或multiple="multiple"属性。
3.服务器端读文件
从Servlet 3.0 开始，可以通过 request.getPart() 或 request.getPars() 两个接口获取上传的文件。

❻ ajaxSubmit做文件上传为什么在IE中进度条无反应

IE无解，不支持，Progress是html5 xhr对象的新属性，不知道IE10支持formdata没有。岩圆。枣慧
uploadify应该是兼容性最好的了，flash实现，不过臭屁的ios不支持。。
折中的办法就凳枣答是判断是否ie，是ie就用uploadify，其他浏览器用jquery.form.js

❼ ajax+php实现进度显示是怎么实现的

写个PHP，访问时输出当前的进度百分比。前台javascript发ajax访问这谨悄个PHP，解析数字修改前台某元素宽度
这要是看不懂那就没办法只好祥陆渣上个垃圾代码供你参考了
loop.php

for($i=0;$i<1000;$i++){
do_something();
file_put_contents("progress.log",$i);
}

ajax.php

echo file_get_contents("悉仔progress.log")

❽ 如何使用ajax做进度条进度信息如何返回

AJAX进度条一般不能反应真实进度（我只是说一般，你所见到的都是伪进度条），其原因就是因为这样做简单，而且用户体验还不错，x0dx0a实现方法如下：x0dx0a点击按钮或者干嘛干嘛一触发这个事件的时候，让进度条燃正 从 0% 缓慢/迅速 增长到 20%。x0dx0abeforeSend 触发一个事件，让进度条 从20% 缓慢碰孝/迅速 增长到50%。x0dx0acomplete（状态）触发，进度条到 80%。x0dx0a将AJAX回调数据处理完成，进度到100%。x0dx0ax0dx0a------------------------------x0dx0a如果有更高层次要求的话，比如上传进度，要用侦听，每隔1秒或者多少毫秒提交一次AJAX请求来查询进度。比如上传之前，先把文件大小（假设100MB）保存在服务器上的某个Session或者变量里，上传的临时文件大小（假设某次提交侦听请求时，已经上传了5MB），两个数值一除，5%就出来了。。皮吵悔。

❾ php如何实现上传文件显示上传进度百分比

程序需要php的apc模块的支持，关键点就是在上传的form里添加一个hidden的inpu标签，里面要有name为
APC_UPLOAD_PROGRESS的属性，value值为一个随机数一遍多个人上传。

apc模块的安装方法是，下载php_apc.dll放到ext文件夹下，在php.ini文件里添加
upload_max_filesize =100M
apc.rfc1867 = on
apc.max_file_size = 100M
extension=php_apc.dll
然后测试配置是否成功：
if(apc_fetch)
{echo "apc is working"}
else{echo "apc is not supported!";}

❿ 大神，ThinkPHP 上传文件进度条怎么实现的

Web Uploader
这个插件是网络出的，有进度条，兼容ie7及以上。
原理就是ajax上传，会返回1-100的数值，根据这个值来操作进度条。如果还有不明白的话，你可以在后盾人看看视频找找答案，有空多看看时间长了，慢慢就明白了，希望能帮到你，给个采纳吧谢谢