我怎样才能让我的进度表同步得更好?
How can I make my progress meter synchronize better?
我做了一个文件上传进度表,最多可以计数到 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>
额外时间,是服务器处理您的请求所花费的时间。如果你让服务器 return 更快,你在 100% 之后的等待时间会更少。客户端不能为它的服务器端部分制作进度条,因为它不知道要花多长时间。您的进度条仅在上传数据时有效。
也许您可以在服务器上进行一些异步处理,然后 return 更快?你也可以让服务器知道处理你的请求的进度并将其计算到栏中。
我做了一个文件上传进度表,最多可以计数到 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>
额外时间,是服务器处理您的请求所花费的时间。如果你让服务器 return 更快,你在 100% 之后的等待时间会更少。客户端不能为它的服务器端部分制作进度条,因为它不知道要花多长时间。您的进度条仅在上传数据时有效。
也许您可以在服务器上进行一些异步处理,然后 return 更快?你也可以让服务器知道处理你的请求的进度并将其计算到栏中。