jquery文件上传进度条不准确
jquery file upload progress bar inaccurate
我正在使用jquery文件上传(http://blueimp.github.io/jQuery-File-Upload/)插件。
我的代码:
$('#fileupload').fileupload({
url: 'server/index.php',
dataType: 'json',
dropZone: $('#dropzone'),
}).bind('fileuploadprogress', function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('.progress-bar').css('width', progress + '%');
});
当我上传文件时,进度条非常不准确。每次上传时,无论文件大小,进度条都会一直停留在10%左右,直到文件上传完成,然后它会直接上升到100%。
为什么它会那样?如何修复它以正确显示进度?
谢谢。
我也遇到了文件进度条问题。奇怪的是,同样的实现在我开发的另一个网站上有效,但在另一个上无效。尽管这可能很奇怪,但我花了几个小时的时间试图弄清楚发生了什么。我在某个地方读到了另一个问题,blueimp在这里说,它使用类似的设置测试得很好,有人提到他们有一个代理。我没有代理,但后来我在另一台电脑上查了一下。工作正常,另一台电脑再次工作正常。然后我在我的主电脑上禁用了AVG,你不知道吗,它工作得很好。似乎在启用AVG的情况下,我加载的数据几乎总是与data.total相同。我相信这与一些愚蠢的缓存或他们为"提高"你的浏览速度而实现的东西有关。
问题是,当您使用默认的autoUpload
选项时,文件会在add
回调中立即提交,而对于n
对progressall
回调的第一次调用,data.total
不会完全更新。(n
取决于工作站速度和progressInterval
选项(
我找到的解决方案是在add
的第一次调用中计算总文件长度,并在progressall
中使用它。
var originalAdd = $.blueimp.fileupload.prototype.options.add;
var iFilesCount = 0;
var dataTotal = 0;
$('#fileupload').fileupload({
...
progressall: function (e, data) {
if (dataTotal == 0) {
dataTotal = 1;
}
var iProgress = parseInt(data.loaded / dataTotal * 100, 10);
$('#progress .progress-bar').css('width', iProgress + '%');
},
add: function (e, data) {
if (iFilesCount <= 0) {
iFilesCount = data.originalFiles.length;
dataTotal = 0;
var i = 0;
// sum up files lengths
for (i=0; i < iFilesCount ;i++){
dataTotal = dataTotal + data.originalFiles[i].size;
}
}
iFilesCount--;
// recall default add callback
originalAdd.call(this, e, data);
}
...
}
progressall
中console.log的输出(data.load+'/'+data.total+'/'+dataTotal(
536710 / 1610128 / 30060524 '
1073418 / 6977218 / 30060524 |
1610128 / 8587402 / 30060524 |
2146838 / 12881204 / 30060524 |
2683550 / 13954660 / 30060524 |
3220258 / 16638300 / 30060524 |-- progress bar is not accurate
3756968 / 19858646 / 30060524 |
4293676 / 24689178 / 30060524 |
4830384 / 27909544 / 30060524 /
5367092 / 30060524 / 30060524 '
5903800 / 30060524 / 30060524 |
6440510 / 30060524 / 30060524 |
6977218 / 30060524 / 30060524 |
7513946 / 30060524 / 30060524 |
8050674 / 30060524 / 30060524 |-- accurate progress bar
... |
... |
30060524 / 30060524 / 30060524 /
相关文章:
- Angular 2:在本地.json文件上找不到文件
- 放大弹出生成“;找不到文件”;YouTube视频的错误
- jquery打印[object XMLDocument]而不是文件内容
- Web 地址虚拟目录会断开外部 JavaScript 链接,因此找不到文件
- ASP.NET MVC 脚本.渲染不合并文件..
- 在 JavaScript 中对音频文件进行计时不准确
- 如何在不打开文件的情况下下载文件
- 谷歌地图API-缩小时默认标记不准确
- javaScript警报和提示框将我重定向到另一个页面,上面写着“;找不到文件”;
- 可以't在不提供文件扩展名的情况下导入TypeScript模块
- 浏览器不生成文件下载对话框
- XMLHttpRequest内容长度不等于文件的实际大小
- 轨道:找不到文件“提前输入.js”.直到我删除“数据涡轮链接”
- Socket.io 设置间隔不准确
- 呵呵!与 npm 找不到文件有关
- CreateJS的PreloadJS进度事件不准确
- kineticjs - 鼠标悬停不准确
- 使用 PDF 打开 PDF 文件.js而不将文件作为查询字符串传递
- 计算何时多次写入文件会导致不准确
- jquery文件上传进度条不准确