方法一：
FormData
模拟创建一个表单，
<input type="file" id="fileUrl" name="fileUrl" >
//上传控件
var filePoint = $('#fileUrl');
//表单对象
var formData = new FormData();
formData.append('file', filePoint[0].files[0]);
formData.append('cityId', cityId);
$.ajax({
type:"post",
url:"/test/1",
enctype: 'multipart/form-data',
async:true,
contentType: false, //这个一定要写
processData: false, //这个也一定要写，不然会报错
data:formData,
dataType:'json', //返回类型，有json，text，HTML。这里并没有jsonp格式，所以别妄想能用jsonp做跨域了。
success:function(data){
}，
error:function(){
},
后端java
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
@RequestMapping("/1")
@ResponseBody
public Object analyseXls(MultipartHttpServletRequest multipartRequst) {
BackMsgEntity backMsg = new BackMsgEntity();
if(multipartRequst == null){
backMsg.setMsg("服务请求失败，请重试");
log.error("服务请求失败,MultipartHttpServletRequest空指针");
return backMsg;
}
MultipartFile fileLink = multipartRequst.getFile("fileUrl");
String fileName = fileLink.getOriginalFilename(); //文件名
String cityId = multipartRequst.getParameter("cityId"); //登录账号省份
//存文件
fileLink.transferTo(new File(fileUrl));
}
transferTo() 方法会自动覆盖已存在的文件，经试验采用的应该是TCP/IP协议
方法二：
ajaxSubmit
需要引入 jquery-form.js 我用的是jquery-form.mini.js
需要form表单
<form id="fileForm" onsubmit="return uploadFile();">
<input type="file" id="fileUrl" name="fileUrl" >
<input type="hidden" value="SC" name="cityId" id ='cityId'>
</form>
<button onclick="uploadFile()">上传xls文件</button>
input 一定要加上name属性，因为后台是更具name值来读取变量的。
function uploadFile(){
var fileForm= $("#fileForm");
fileForm.ajaxSubmit({
url: "/test/1",
type: 'post',
dataType: 'json',
success: function(data){
if(data.flag == 1){
toastr.success(data.msg);
} else {
toastr.error(data.msg);
}
},
error: function(data){
toastr.error('请求服务异常！');
}
});
return false;
}
返回 false 阻止工单提交导致的跳转刷新
后台同“方法一”