jquery - 我怎样才能让我的进度表同步得更好?

标签 jquery html css ajax progress-bar

我制作了一个文件上传进度表,最多可以计数 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>

最佳答案

额外的时间,就是服务器处理你的请求所花费的时间。如果你让服务器返回得更快,你在 100% 之后的等待时间就会更少。客户端不能为它的服务器端部分制作进度条,因为它不知道要花多长时间。您的进度条仅在上传数据时才有效。

也许您可以在服务器上进行一些异步处理,然后更快地返回?你也可以让服务器知道处理你的请求的进度并将其计算到栏中。

关于jquery - 我怎样才能让我的进度表同步得更好?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31485154/

相关文章:

JavaScript表单验证函数: Looping each item

javascript - $(this) 和 event.target 不同但应该相同

javascript - 如何将 HTML5 桌面通知的关闭时间更改为不自动关闭?

javascript - 如何将 Bootstrap 4 轮播与一组控件同步?

html - 当 localStorage 已满时会发生什么?

javascript - 滚动浏览多个 DIV 元素

html - 页脚中的导航菜单被截断(垂直打开)

html - 为什么更改复选框后元素不对齐?

javascript - 如何获取 CSS 位置 : fixed for a background image to work properly?

html - 在 div 中自动调整图像大小