jquery-file-upload 簡單使用（Hello）

1、文件引用（官網上隨便找個栗子）

<script src=".../jquery-file-upload/js/vendor/jquery.ui.widget.js" type="text/javascript"></script>  
<script src=".../jquery-file-upload/js/jquery.iframe-transport.js" type="text/javascript"></script> 
<script src=".../jquery-file-upload/js/jquery.fileupload.js" type="text/javascript"></script>

---

2、準備input控件

  //data-url  後臺請求地址  accept 文件類型（其實這個是給PC用的） 官網搬運工
<input id="uploadFile" type="file" name="files[]" accept="application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"  data-url="${ctx}/ydzijin/zjxmgxzjjhshangbaoT/import" multiple>

---

3、input 時間處理  幹活  （聲明只爲知足我工做上的需求）

//將input加載成fileupload控件
$('#uploadFile').fileupload({
dataType: 'JSON',     //返回數據類型
maxNumberOfFiles : 1, //上傳文件數
maxFileSize: 5000000, //上傳文件大小
submit:function (e, data){ //文件上傳前回調 返回true 才發送上傳
//獲取文件類型
var type = data.files[0].type;
    //檢測文件類型
//application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
if(type == 'application/vnd.ms-excel' || type ==  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'){
return true;
}
//提示信息
top.$.jBox.tip("上傳文件類型錯誤！", 'error');
return false;
},
    progressall: function (e, data) {   //文件上傳時回調  用於顯示上傳進度 
    },
    done: function (e, data) { //成功或回調
    }
});

4、後臺處理（有點意思） Spring MVC

根據官網Spring MVC 栗子完成。這個控件好像不能直接幫你把文件注入到MultipartFile 須要注入請求MultipartHttpServletRequest 直接上代碼

@RequestMapping(value = "import", method=RequestMethod.POST)
	@ResponseBody
	public Object importFile(MultipartHttpServletRequest request, HttpServletResponse response){
		
		//獲取全部文件名的迭代器
		Iterator<String> fileNames = request.getFileNames();
		MultipartFile file = null;
		//拿到每一個文件
		while (fileNames.hasNext()) {
		 file = request.getFile(fileNames.next());
		}
		//拿到文件你想幹嗎就幹嗎 收工
		return null;
	}

5、總結

此篇博文只求使用，不深刻剖析任何原理。