使用plupload.js上传文件

1、引入js文件

2、html文件

开始上传

3、js初始化上传控件

//初始化上传控件
var uploader = new plupload.Uploader({
   browse_button : 'browse',
   url : url,//对应的文件上传的后台路径
   max_file_size: '20mb',//限制为20MB
   filters: {
       mime_types: [ //只允许上传图片文件
           { title: "Excle文件", extensions: "xls,xlsx" }
       ]
   }
});
uploader.init();//这句必须有

//文件添加时的事件
uploader.bind('FilesAdded', function (uploader, files) {
   var file = files[0];
   document.getElementById("filecomment").innerHTML+='
' +
       ' (' + plupload.formatSize(file.size) + ')';
});
//开始上传
document.getElementById('start_upload').onclick = function(){
   if(document.getElementById("filecomment").text==''){
       layer.msg("请选择附件后上传!");
       return;
   }
   var name = $("#userName").val();
   if (name == "" || name == null) {
       layer.msg("真实姓名不能为空");
       return;
   } else if (name.length > 20) {
       layer.msg("姓名不能超过20位");
       return;
   }
   uploader.start();
}
uploader.bind('BeforeUpload', function (uploader, files) {
   var file = files[0];
//修改url向后台传参数
   uploader.settings.url = url + "/saveFiles?file="+ $("#filecomment").val();
});

// 完成上传完了，成功或者失败，先删除进度条。
uploader.bind( 'uploadComplete', function( file ) {
   layer.msg("上传完成!");
   currobj.showreportview(currobj.options.experimentId);
});
// 完成上传完了，成功或者失败，先删除进度条。
uploader.bind( 'Error', function( uploader,errObject  ) {
   var errcode=errObject.code;
   if(errcode==-600 ){
       //alert(err.file.name+"文件大小已超过5Mb,请重新选择上传");
       layer.msg(errObject.file.name+"文件大小已超过20Mb,请重新选择上传");
   }else if( errcode==-601 ){
       //alert(err.file.name+"文件格式错误,请重新选择上传");
       layer.msg(errObject.file.name+"文件格式错误,请选择Excle格式的文件后重新上传");
   }else{
       $("#error_"+errObject.file.id).text(errObject.message+" 请删除，重新上传");
   }
});