作者shadowjohn (这事要用身体解释)
看板Ajax
标题Re: [问题] 请问如何实现ajax的载入时进度百分比?
时间Fri May 1 20:39:38 2015
※ 引述《banana2014 (香蕉共和国)》之铭言:
: ※ 引述《banana2014 (香蕉共和国)》之铭言:
: : 当用ajax传输资料时,在还没有得到伺服器端运算的结果时,如何得到目前的进度百分比?
: http://shadowjohn.pcro.co/uploads/
: 请问这上传进度百分比是怎麽做到的,可以告诉我详细步骤吗?
: 上传如果可以用AJAX来判断上传进度,那载入画面(对AJAX而言是载入资讯)可以吗?
: 我知道有个叫什麽pace的东西,好像也可以在载入画面时显示进度条,但是它只能在页面
: 刚载入时显示出来,对於ajax的载入资讯好像不会显示进度条耶,请问ajax版的载入资讯
: 进度条该怎麽做,请各位帮帮我,谢谢。
我把 Code 整理了一下
这是上传有进度的范例:
范例网址:
http://3wa.tw/muploads/
原始内容:
http://3wa.tw/muploads/index.phps
注解也写了,如果不懂可以问我 :)
其实关键就主要是:
1. 载入 jquery、jquery.form
2. 「ajaxSubmit」代替原本的 form submit
3. 利用 uploadProgress 取得的资讯来作 progress value or bar
如果你是要上传後,东西开始後伺服器後面运作,前端想要偶尔知道该工作的进度
最简单的方法,就是在你後台的东西,依照进度,偶尔去更新一个 id.txt
id.txt
5%
隔一段时间,你知道他进度又提升,变 20%
那你就把 id.txt 内容设成 20%
你的前端,就用 ajax 定期(一秒)去要新的值回来
setInterval(function(){
var tmp = ajax....('id.txt');....
显视内容
},1000);
简单的这样作就ok啦 :)
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 123.110.45.216
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Ajax/M.1430483981.A.CD1.html
1F:推 Timba: PUSH 05/02 20:34
2F:推 banana2014: 请问这个jquery.form适用於AJAX的资讯下载进度百分比 05/03 13:29
3F:→ banana2014: 吗? 05/03 13:29
4F:→ shadowjohn: 下载不是有浏览器本身的进度? 05/03 14:46
5F:推 banana2014: 嗯…我说的下载是载入资讯的下载 05/05 21:26