使用plupload.js上傳檔案

1、引入js檔案

2、html檔案

<input id="filecomment" class="data_sc data_sc1"  type="hidden">
<span class="choseFile">
     <input type="button" name="" id="browse" value="選取檔案" />
</span>
      

<button id="start_upload">開始上傳</button>      

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+='<p class="clearfloat" id="p_' + file.id + '"><var><a       href="javascript:downloadfile(\'\');" target="_blank" rel="external nofollow"  id="down'+file.id+'" title="'+file.name+'">' +
       ' </a>(' + plupload.formatSize(file.size) + ')<b></b></var><span id="error_'+file.id+'"></span>';
});
//開始上傳
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+" 請删除，重新上傳");
   }
});