可以在该事件回调函数中对文件类型进行筛选,或者根据文件大小决定是否开启分片上传
uploader.on( 'beforeFileQueued', function( file) {
console.log('文件加入队前',file)
});文件加入队列后

// 当有文件被添加进队列的时候
uploader.on( 'fileQueued', function( file ) {
console.log('文件加入队列后')
var $list = $('#fileList')
$list.append( '<div id="' + file.id + '" class="item">' +
'<h4 class="info">' + file.name + '</h4>' +
'<p class="state">等待上传...</p>' +
'</div>' );
});

点击 选择文件 按钮后,选择一个文件,就会如上图所示,出现文件列表,从代码可以看出,他是在选择文件之后,动态添加的的 dom ,显示文件名称以及状态,关于文件的详细信息,则可以从 fileQueued 事件的回调函数的参数 file 获取,我们打印一下 file
ext——————————文件后缀
id——————————-文件ID
lastModifiedDate—————–文件最后修改时间
name—————————–文件名称
size—————————–文件大小(这里是以字节为单位,1字节=1KB,1M=1024KB,1m=1024*1024字节)
source—————————包含一些文件信息和方法,例如唯一标识的`ruid`、`uid`、`_hash`
文件上传中
主要利用了 webuploader 的
uploadProgress 事件,该事件会在文件上传过程中触发,可以利用该事件创建进度条
// 文件上传过程中创建进度条实时显示。
uploader.on( 'uploadProgress', function( file, percentage ) {
console.log('文件上传中',file,percentage)
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +










