上次文件进度达到100％和停止/完成事件之间的巨大差距？ [英] Large gap between last file progress hitting 100% and the stop/done events?

问题描述

我使用 blueimp文件上传插件来实现一些文件上传功能，而我我注意到，当我的上一个文件进度条达到100％时，以及停止和完成事件发生时，可能会有很大的时间间隔。我有以下代码：

<$ fileupload（）{
dataType：'json'，
progress：function（e，data）{
var progress = parseInt（data.loaded / data.total * 100，10）;
var bar = data.context.children（）。children（。progress）;
$（bar）.css width，progress +％）;
}，
add：function（e，data）{
data.context = $（< div> ）.html（上传...< div class ='progressHolder'>< div class ='progress'>& nbsp;< / div>< / div>）。appendTo（$ （＃文件））;
data.submit（）;
$（＃processing）。fadeIn（）;
}，
stop：function（e，data）{
$（＃uploadFiles）。fadeIn（）;
$（＃processing）。fadeOut（）;
，
完成：function（e，data）{
$ .each（data.result.files，function（index，file）{
idArray.push（file。 Id）;
}）;
}
}）;

有谁知道为什么会这样？我怎样才能使进度条考虑到完成/停止将被调用？

解决方案

当您上传文件，该文件首先（显然）上传到服务器，服务器然后将执行所请求的服务器端脚本，然后处理该文件。如果请求中的处理文件部分不是即时的，则在达到100％的进度和完成的回调被触发之间将存在延迟。如果有网络延迟，也可能会有延迟。
$ b $进度事件只跟踪上传的进度，而不是请求的进度。

一个解决方案是让你的进度条停在 90％然后碰到 100％ 在完成回调。只需乘以 data.total 由 1.1

  progress：function（e，data）{
 var progress = parseInt（data.loaded /（data.total * 1.1）* 100，10）; 
 var bar = data.context.children（）。children（。progress）; 
 $（bar）.css（width，progress +％）; 
}，
  

I am using the blueimp File Upload plugin to implement some file upload functionality and I've noticed that there can be large gaps of time between when my last file progress bar hits 100% and when the stop and done events fire.I have the following code:

        $('#fileupload').fileupload({
            dataType: 'json',
            progress: function (e, data) {
                var progress = parseInt(data.loaded / data.total * 100, 10);
                var bar = data.context.children().children(".progress");
                $(bar).css("width", progress + "%");
            },
            add: function (e, data) {
                data.context = $("<div></div>").html("Uploading...<div class='progressHolder'><div class='progress'>&nbsp;</div></div>").appendTo($("#files"));
                data.submit();
                $("#processing").fadeIn();
            },
            stop: function (e, data) {
                $("#uploadFiles").fadeIn();
                $("#processing").fadeOut();
            },
            done: function (e, data) {
                $.each(data.result.files, function (index, file) {
                    idArray.push(file.Id);
                });
            }
        });

Does anyone know why this would be happening? How can I make it so that the progress bars take into account when done/stop will be called?

解决方案

When you upload a file, the file is first (obviously) uploaded to the server, the server then will execute the requested server-side script where you then handle the file. If the "handle the file" part of the request isn't instant, there will be a delay between the progress reaching 100% and the done callback being triggered. There may also be a delay if there is network lag.

The progress event only tracks the progress of the upload, not the progress of the request.

One solution would be to have your progress bar stop at say, 90% then bump it to 100% in the done callback. simply multiply data.total by 1.1

        progress: function (e, data) {
            var progress = parseInt(data.loaded / (data.total*1.1) * 100, 10);
            var bar = data.context.children().children(".progress");
            $(bar).css("width", progress + "%");
        },

这篇关于上次文件进度达到100％和停止/完成事件之间的巨大差距？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！