Re: [問題] 請問如何實現ajax的載入時進度百分比?

作者: shadowjohn (轉角遇到愛)   2015-05-01 20:39:38
※ 引述《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啦 :)
作者: Timba (踢音霸)   2015-05-02 20:34:00
PUSH
作者: banana2014 (香蕉共和國)   2015-05-03 13:29:00
請問這個jquery.form適用於AJAX的資訊下載進度百分比嗎?
作者: shadowjohn (轉角遇到愛)   2015-05-03 14:46:00
下載不是有瀏覽器本身的進度?
作者: banana2014 (香蕉共和國)   2015-05-05 21:26:00
嗯…我說的下載是載入資訊的下載

Links booklink

Contact Us: admin [ a t ] ucptt.com