[問題] XMLHttpRequest 綁事件
請問我在做檔案上傳使用 XMLHttpRequest LV2
想要做到一個功能,告知USER 開始上傳、上傳中、上傳結束、上傳成功四種狀態
程式如下
var xhr = new XMLHttpRequest();
xhr.onload = function()
{
if (this.status == 200)
{
var jsonData = JSON.parse(this.response);
if (jsonData.message != "ok") {
showMsg('出錯了,'+ jsonData.message , false);
}else{
showMsg('上傳成功,路徑:'+ jsonData.return.seaveSrc , false);
}
};
};
xhr.upload.onprogress = function (event)
{
if (event.lengthComputable)
{
showMsg('開始上傳' , false);
}
}
xhr.upload.loadstart = function() {
showMsg('開始上傳' , false);
};
xhr.loadEnd = function() {
showMsg('上傳結束' , false);
};
xhr.error = function() {
showMsg('上傳失敗' , false);
};
xhr.abort = function() {
showMsg('上傳中斷,來自使用者' , false);
};
xhr.open('POST', contextRoot+"/saveImage.php",false);
xhr.send(formData);
結果不行,只有onload 發生作用
經過爬文,又改成
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("loadstart", function(e) {
showMsg('開始上傳' , false);
});
xhr.upload.addEventListener("load", function(e) {
showMsg('上傳結束' , false);
});
xhr.open('POST', contextRoot+"/saveImage.php",false);
xhr.send(formData);
結果也是不行,
檔案有傳到SERVER,也有回應,但是EVENT Function 沒有反應,
請問哪裡錯了嗎?
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.135.143.146
推
10/06 19:48, , 1F
10/06 19:48, 1F
→
10/06 20:19, , 2F
10/06 20:19, 2F
我剛剛試著甲地上傳到乙地,上傳13M檔案,傳了大概10多秒吧,
也沒有出現預期的event
※ 編輯: pttnews 來自: 210.63.96.2 (10/07 10:07)
推
10/07 10:48, , 3F
10/07 10:48, 3F
只有出現 「上傳成功,路徑:XXXXX」
謝謝您
目前只接受JPG 檔案
※ 編輯: pttnews 來自: 210.63.96.2 (10/07 11:39)
→
10/07 13:36, , 4F
10/07 13:36, 4F
→
10/07 13:36, , 5F
10/07 13:36, 5F
→
10/07 13:37, , 6F
10/07 13:37, 6F
→
10/07 13:37, , 7F
10/07 13:37, 7F
耶~真的耶,我設錯了,真是太感謝d大指點,
謝謝~感激萬分!
但是很奇怪的是 「上傳成功」、「傳送中」event 都有出現,開始傳送等Event並沒出現
真的很感謝大大指導,
再次跟您說謝謝~
※ 編輯: pttnews 來自: 210.63.96.2 (10/07 14:33)
推
10/07 15:27, , 8F
10/07 15:27, 8F
※ 編輯: pttnews 來自: 210.63.96.2 (10/07 15:40)
推
10/07 15:57, , 9F
10/07 15:57, 9F
→
10/07 15:58, , 10F
10/07 15:58, 10F
喔~ya~
有出現 開始上傳、上傳中、上傳結束 等event
如qwer大所述,要加入第三個參數
補上sample code
xhr.upload.addEventListener("loadstart", function(e){
showMsg('開始上傳' , false);
}, false);
xhr.upload.addEventListener("progress", function(e){
showMsg('上傳中' , false);
}, false);
xhr.upload.addEventListener("load", function(e){
showMsg('上傳結束' , false);
},false);
謝謝qwer大大,
兩位大德,小弟感激於心,謝謝~
※ 編輯: pttnews 來自: 220.135.143.146 (10/07 23:05)
→
10/08 01:46, , 11F
10/08 01:46, 11F
Ajax 近期熱門文章
PTT數位生活區 即時熱門文章