javascript - XMLHttpRequest.upload 进度事件仅适用于 IE

标签 javascript file-upload progress-bar progress xmlhttprequest-level2

我正在尝试获取上传进度(顺便说一句,那只是一张图片)。 我使用了 XMLHttpRequest 并且几乎像互联网上的其他人一样做了,如下所示:

var upProgress = function(e) {
    console.log(e.loaded, e);
};

var fd = new FormData();
fd.append('image', file);

var xhr = new XMLHttpRequest();
xhr.upload.addEventListener('progress', upProgress, false);

xhr.open('POST', _Utilities.urlApi + url);
xhr.send(fd);

图片已上传,该部分有效。 但是,进度事件(在 Firefox 31 和 Chrome 36 中)仅在 e.loaded = e.total = file' size 时触发一次(在开始时)。它在 IE 11 中工作,同一图片事件被触发了十几次(大约 2.7Mo)。

我在这里迷路了,我在网上搜索但没有找到我尚未完成的任何事情。 例如,当 lengthComputable = false 时,e.loadede.total 应该相同,但此处不是这种情况。

上面的console log在Chrome和Firefox中只显示了1行,下面是progress事件元素的部分内容:

lengthComputable: true
loaded: 2797378
total: 2797378
totalSize: 2797378
type: "progress"

但是在 IE 上我得到了这个(我记录了加载的值和事件的元素):

149 [object ProgressEvent]
131072 [object ProgressEvent]
262144 [object ProgressEvent]
...
2752512 [object ProgressEvent]
2797384 [object ProgressEvent]

这意味着它按预期工作。

我不知道是什么原因造成的。 以上都是在我的机器上测试的。我遇到过一些人,他们只是在某些机器或设置上遇到了问题,一个 friend 在它的机器上试了一下,结果是一样的(Windows 8.1 和 Chrome),另一个 friend 试了同样的结果(MACOS 和 Chrome)。

如果您有任何想法,请在这里分享,提前谢谢!

最佳答案

请从这里查看我的回答 XMLHttpRequest upload progress not firing correctly ,我也有这个,经过痛苦的几个小时后,这只是我的防病毒程序 ...也许它也与您有关?

关于javascript - XMLHttpRequest.upload 进度事件仅适用于 IE,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25623849/

相关文章:

javascript - HTML5 拖放文件字段

javascript - 使用 JavaScript 或 jQuery 重新排列 HTML 元素的出现顺序

javascript - 为什么ajax一个接一个发送请求

PHP 媒体上传库

file-upload - 在环回中使用远程 Hook 从另一个模型访问数据

internet-explorer - 进度条在除 IE 之外的所有浏览器中工作(Angular + bootstrap)

java - 如何在标记下方添加 ProgressBar 和按钮

ios - 显示微调器事件,直到加载音频文件 IOS7

javascript - 如何创建向查询添加 AND 语句的 AND 按钮?

javascript - 有没有办法使用 jquery 克隆表的列?