【问题标题】:blueimp Jquery upload plugin : Large gap between last file progress hitting 100% and the done eventblueimp Jquery 上传插件:上一个文件进度达到 100% 和完成事件之间的差距很大
【发布时间】:2015-05-30 10:04:35
【问题描述】:

所有人都在问同样的问题,在所有线程和论坛中都没有任何答案。

$('#fileupload').fileupload({
    dropZone: $("#dragandrop"),
    pasteZone: $("#dragandrop"),
    //singleFileUploads: false,
    //progressInterval:50,
    //bitrateInterval:500,
    //forceIframeTransport: true,
    dataType: 'json',
    add: function (e, data) {
        data.submit();
    },
    progress: function (e, data) {
            //if (data.loaded == data.total ) {
            //    if (e.lengthComputable) {
            var progress = parseInt(data._progress.loaded / data.total * 100, 10);
            console.log(data.loaded + " " + data.total + " " + data.bitrate);
            $('#progress .bar').css('width', progress + '%');
        //}
    },
    always: function (e, data) {
        $('#progress .progress-bar').css('width',0);
    },
    done: function (e, data) {
        var result = data.result.data;
        //add the flash success message
        $('#trust-center-flash-message').html(result.message);
        //add the new images to the preview
        previewImages(result.attachments);
        return alert("done");
    }
});

我尝试了互联网上的所有解决方案。 我没有使用插件后端 php 类。

【问题讨论】:

  • 我发现这个差距是因为我的后端造成的。但是,无论如何,当后端完成时,它是否可以工作?
  • 请在此处查看我的解决方案/解决方法:stackoverflow.com/a/47461810/2277301

标签: php jquery file-upload progress-bar blueimp


【解决方案1】:

正如Kevin B says it 和你提到的自己:

进度事件只跟踪上传的进度,而不是 请求的进度。

解决此问题的一种方法是更新我们对进度事件的响应方式。

一种解决方案是让进度条停在 90% 处 在 done 回调中将其提高到 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 + "%");
    },

您也可以为“progressall”事件执行此操作,具体取决于您要修改的事件。

对于所有的回调see the API,这里有一些你可能感兴趣的回调

$('#fileupload')
...
.bind('fileuploadprogress', function (e, data) {/* ... /})
.bind('fileuploadprogressall', function (e, data) {/
... /})
.bind('fileuploadchunkdone', function (e, data) {/
... /})
...
.bind('fileuploadprocessdone', function (e, data) {/
... */})

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多