我从这里下载了1个上传进度栏:http://www.malsup.com/jquery/form/progress3.html
这是完美的;无论如何,仅当文件上传时,它才会提供有关文件的状态,例如:
在http://mysite.com/1.jpg中上传的文件
但是,上载新文件时,状态消失,并且有关刚上载的新文件的详细信息也会出现。
我只想拥有旧状态,上载新文件时,新状态只是出现在旧状态下。我该怎么办?
这是代码:
(function() {
var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');
$('form').ajaxForm({
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);
//console.log(percentVal, position, total);
},
complete: function(xhr) {
status.html(xhr.responseText);
}
});
})();
</script>
如果您在链接中看到demo并理解得很好,则该状态将显示在HTML内,如下所示:
<div id="status"></div>
谢谢!
最佳答案
您的complete
回调正在重置status.html()
,并且beforeSend
用status
清空status.empty();
。删除该行!
然后尝试使用prepending用某些标记包装的最新消息,而不是覆盖status
的全部内容:
complete: function(xhr) {
var message = '<div class="new">' + xhr.responseText + '</div>';
status.prepend(message);
}