问题1:ajaxfileupload返回json带<pre>
问题描述:
文件正常提交,后台接收正常,action中返回json正常,用火狐查看,响应的值也是正常的
但是,ajax调用js中,就是不走success的方法。
经过调查,是因为返回的json中,带有<pre>
标签。
解决方法:
ajaxfileupload.js文件,uploadHttpData中
eval( “data = ” + data );变为data = jQuery.parseJSON(jQuery(data).text());
问题2:IE、Chrome文本选择框的值就丢失问题
问题描述:
前台选择图片后,onchange事件调用ajaxfileupload方法然后在后台进行图片校验,但调用完后文本选择框的值就丢失了,如果不调用ajaxfileupload的话,文本选择框就会显示图片的路径(IE、Chrome有这个问题,但火狐是没问题的)
解决方法:
由于安全考虑,在IE和chrome下 ,jquery的clone并不能克隆input field的值,所以就导致克隆后新的input丢失了原来的值。
在jQuery(form).submit(); 后面加上这四句,原理是提交后把元素再复制回来
var oldElement = jQuery('#jUploadFile' +id ,form);
var newElement = jQuery('#'+s.fileElementId );
jQuery(newElement).replaceWith(oldElement);
jQuery(oldElement).attr('id', s.fileElementId );
问题3:ie 返回json弹出下载框问题
问题描述:
js 配合java springMVC后台,成功后返回消息,chrom ff都正常,只有IE提交后返回的JSON弹出下载框
解决方法:
查看类型application/json google后发现原来是IE不支持该标识,所以一律作为文件下载
网上一般有三种方法:
一是手工指定response
二是修改配置文件(但本人一直为试验成功)
三是不再用 @ResponseBody,改用ResponseEntity
这种方法成功率最高,但是修改起来比较麻烦,如果你有很多地方已经用了@ResponseBody的话
本实例也采用第三种方法,修改后代码如下
@RequestMapping("/security/uploadPic")
public ResponseEntity<Map<String, String>> uploadPic(HttpServletRequest request,HttpServletResponse response) throws Exception {
// 设置响应类型为json并设置响应编码为utf-8
String itemId = request.getParameter("itemId");
Map<String, String> retMap = null ;
String result = "success"; //文件上传结果反馈
retMap = fileUpload(request,itemId);
if(StringUtils.isNotEmpty(retMap.get("reason"))){
result = "failure";
}
retMap.put("result", result);
logger.info("uploadPic:" + retMap);
HttpHeaders headers = new HttpHeaders();
headers.setContentType(MediaType.TEXT_PLAIN);
return new ResponseEntity<Map<String, String>>(retMap, headers, HttpStatus.OK);
}
以上是使用ajaxfileupload.js时遇到的问题,记录一下,希望有其他问题的可以和我联系加上新的问题和解决方法,持续更新中…
参考文档如下:
http://blog.csdn.net/ye1992/article/details/21178579
http://bbs.csdn.net/topics/390910571
http://www.bubuko.com/infodetail-374296.html