公司让做一个excel文件提交保存的功能
在chrome浏览器中,测试完全没问题,但是到了ie11上就点击按钮没反应了,下面把修改的地方标识出来,现在完全解决了
@ResponseBody
@RequestMapping(value = "/upload", produces = { "text/html;charset=UTF-8" })
public String uploadSellData(Model model,
@RequestParam(required = false, value = "file") MultipartFile file) throws IOException {
return messsage;
}
这里不要加@ResponseBody,produces={"text/html;charset=UTF-8"},切记,
之前写出produces={"application/json;charset=UTF-8"}就无法正常返回数据了
<form id="query_form" enctype="multipart/form-data" action="/mvc/sell/mobile/upload" method="post" target="progress" role="form">
<tr id="excel">
<td colspan="4" style="height: 50px">
<input readonly="true" style="width: 40%; vertical-align: top; padding-top: 10px;" type="text" />
<a class="button_preview" href="#"><span>浏览</span></a>
<input class="file_new" name="file" size="1" type="file" style="width: 60px; height: 26px;">
<a class="button_tran" href="#" id="uploadFile"><span>上传</span></a>
</td>
</tr>
</form>
这是form表单,form需要加上id,enctype,action,method都不能缺少,上传按钮,绑定点击事件
最关键的是下面的ajax请求
$("#uploadFile").click(function(){
var options = {
type:'POST',
url : "/mvc/sell/mobile/uploadFile?number="+Math.random(),
success : function(data) {
$('#tip').html("文件上传完毕!");
alert(data);
},
resetForm : true,
error:function(data) {
$('#tip').html("文件已上传失败,请重新上传!");
console.log(data);
}
};
$('#tip').html("开始上传文件");
$("#query_form").ajaxSubmit(options);
$('#tip').html("正在上传文件,请稍后......");
return false;
});
这里需要注意的点
1、需要引入jquery.form.js
2、jquery的版本为jquery-1.8.3.js,或者jquery-1.8.3min.js
3、}后面,如果没有代码,不要加逗号
4、加上type="post"
5、请求结束加上return false
6、请求路径后面加上随机数
一个完美的兼容ie浏览器的ajax请求就完成了,如果遇到按钮点击没反应,请求不到后端等问题,这个就是最好的解决方法