1

我正在使用uplodivive插件上传多个文件,这些文件工作正常,但我坚持使用进度条。我必须显示多个文件的总上传百分比

对于单个文件,借助如下onProgress 事件可以轻松确定:

var percent = Math.round((e.loaded / e.total) * 100);

但我想计算多个文件的总百分比,我还在演示文件中检查了 uplodifive 对多个文件一一工作,

是否可以将所有文件一起上传,以便我获得所有文件的总百分比?

看截图,默认uploadifive一个一个加载文件,我想一起上传文件。

在此处输入图像描述

    $('#fileElem').uploadifive({
                'auto'              : false, 
                'height'            : 20, 
                'width'             : 75, 
                'truncateLength'    : 27, 
                'queueID'           : 'fl-que', 
                'simUploadLimit'    : 0, 
                'onSelect'          : function(){ selectHandle(); }, 
                'onCancel'          : function(){ if($('#fl-que > div').length == 1){ cancelHandle(); } }, 
                'buttonText'        : '<span class="plus_icon">+</span> <span class="txt">Add Files</span>', 
                'uploadScript'      : '/wp_themes/itrnsfr/uploadifive.php', 
                'onProgress'        : function(file, e){ progressHandle(file, e); }, 
                'onUploadComplete'  : function(){ uploadCompleteHandle(); }
        });


    function progressHandle(file, e){
            //console.log(file);
            //console.log(e);
            if(e.lengthComputable){
                box.eq(0).hide();   // Hide main uploader
                box.eq(1).show();   // Display progress bar
                box.eq(2).hide();   // Hide the complete MSG

                var percentComplete = Math.round((e.loaded / e.total) * 100);

                $('#loader_val').text( percentComplete + '%');
                var jmeter = ("0." + (percentComplete <= 9 ? "0" + percentComplete : (percentComplete == 100) ? "99" : percentComplete) );
                PG.change({size: parseFloat(jmeter)});
                $('.trnsfr-ratio').text( unitConversion( e.position ) );
            }


        }
4

1 回答 1

1

使用OnUploadProgress

HTML:

<input type="file" name="file_upload" id="file_upload" />
<div id="progress"></div>

JS:

$(function() {
    $("#file_upload").uploadify({
        'swf'              : '/uploadify/uploadify.swf',
        'uploader'         : '/uploadify/uploadify.php',
        'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {
            $('#progress').html(totalBytesUploaded + ' bytes uploaded of ' + totalBytesTotal + ' bytes.');
        }
    });
});
于 2013-06-06T12:27:29.213 回答