FormData进度停留在1％

Question

I am using the code from this Stackoverflow question. For some reason, when the upload starts the percentage value is stuck at 1% and after its completed uploading the success message shows from PHP Script.

Please advise, why is the percentage value stuck at 1%.

jQuery Code

function updateProgress(evt){
    if (evt.lengthComputable) {
        var percentComplete = evt.loaded / evt.total;
        $('form[data-submit="ajax_upload_mp3"] .validation').html( percentComplete + '% Completed').addClass('text-success');
    }
}

$(document).on('submit', 'form[data-submit="ajax_upload_mp3"]', function(){
    wrap = 'form[data-submit="ajax_upload_mp3"]';
    button = 'form[data-submit="ajax_upload_mp3"] .btn-primary';
    url = $(this).attr('action');
    form = $(this);
    formdata = new FormData(form[0]);
    $(wrap + ' .validation').html('').removeClass('text-danger text-success');
    $(wrap + ' .btn-primary').html('Uploading...').attr('disabled', true);
    $.ajax({
        url: url,
        data: formdata ? formdata : form.serialize(),
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        xhr: function(){
            myXhr = $.ajaxSettings.xhr();
            if(myXhr.upload){
                myXhr.upload.addEventListener('progress', updateProgress, false);
            }
            return myXhr;
        },
        success: function(data, textStatus, jqXHR){
            code = ajax_decode(data, 0);
            msg = ajax_decode(data, 1);
            if( code == 1 ){
                $(wrap + ' .validation').html(msg).addClass('text-success');
                $(wrap).trigger("reset");
            } else {
                $(wrap + ' .validation').html(msg).addClass('text-danger');
            }
            $(wrap + ' .btn-primary').html('Upload').attr('disabled', false);
        }
    }); 
    return false;
});

Answer 1

Here:

if (evt.lengthComputable) {
    var percentComplete = evt.loaded / evt.total;
}

It is not a percentage (like 50%), it is a division (like 0.5)
That's why it never exceeds 1.

If you want to display percentage, you need to multiply it by 100:

var percentComplete = evt.loaded / evt.total * 100;

As simple as that :)