上一个文件进度达到 100% 与停止/完成事件之间的差距大吗？答案

【问题标题】：Large gap between last file progress hitting 100% and the stop/done events?上一个文件进度达到 100% 与停止/完成事件之间的差距大吗？
【发布时间】：2013-02-04 16:41:24
【问题描述】：

我正在使用blueimp File Upload plugin 实现一些文件上传功能，我注意到在我的最后一个文件进度条达到 100% 和停止和完成事件触发之间可能存在很大的时间间隔。我有以下代码：

        $('#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);
                });
            }
        });

有人知道为什么会这样吗？我怎样才能使进度条在调用完成/停止时考虑在内？

【问题讨论】：

标签： javascript jquery file-upload blueimp

【解决方案1】：

当您上传文件时，文件首先（显然）上传到服务器，然后服务器将执行请求的服务器端脚本，然后您在其中处理文件。如果请求的 “处理文件” 部分不是即时的，则在进度达到 100% 和触发完成回调之间会有延迟。如果有网络延迟，也可能会有延迟。

进度事件只跟踪上传的进度，不跟踪请求的进度。

一种解决方案是让您的进度条停在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 + "%");
        },

【讨论】：