Question

我制作了一个文件上传进度表，最多可以计算100，但它似乎做得太快了。完成100后有相当长的等待时间。我怎样才能改进它以使计数与上传更加同步？

   <script src="http://malsup.github.com/jquery.form.js"></script>
$(function() {

    var bar = $('.bar');
    var percent = $('.percent');
    var status = $('#status');

    $('form').ajaxForm({
        url: 'http://www.koolbusiness.com/_ah/upload/AMmfu6ZMljyzbg9uayiMv3bOYEVbRkaopfu-ha7I6hHb-FgXpkiXiNuSDRxceyEpzz0q5g4IZt440neSvxI1ePcwP_5shOlqJ164XUJTc0M1XJwjvZbk1RY7QY7cTMmPrco6F3qRBf0O/ALBNUaYAAAAAVakVSot1IKu5WdT3sVltkiWsmS4F2rGn/',
        beforeSend: function() {
            status.empty();
            var percentVal = '0%';
            bar.width(percentVal);
            percent.html(percentVal);
        },
        uploadProgress: function(event, position, total, percentComplete) {
            var percentVal = percentComplete + '%';
            bar.width(percentVal);
            percent.html(percentVal);
        },
        complete: function(xhr) {
           $('#wrapper').html(xhr.responseText);
        }
    });
});

<div class="progress">
    <div class="bar"></div >
    <div class="percent">0%</div >
</div>

<div id="status"></div>

Answer 1

额外时间是服务器处理您的请求所需的时间。如果您使服务器返回得更快，那么在100％之后您将获得更少的等待时间。客户端无法为服务器端部分创建进度条，因为它不知道要花多长时间。您的进度条只有在上传数据时才会计算。

也许你可以在服务器上做一些异步处理，然后返回更快？您也可以这样做，以便服务器可以告知处理您的请求的进度并将其计算到栏中。

如何让我的进度表更好地同步？

1 个答案: