form表单下载文件成功返回值得问题

最新推荐文章于 2025-06-04 10:58:29 发布

转载最新推荐文章于 2025-06-04 10:58:29 发布 · 3.4k 阅读

本文介绍了一个关于使用ajaxForm进行文件上传时，在IE浏览器中遇到的问题及解决方法。当服务器端返回JSON数据时，IE无法正确解析，通过调整响应类型为text/html解决了这一问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ajaxForm问题集锦，一个神奇的问题：使用ajaxForm提交表单上传文件后服务器端返回json数据IE浏览器无法解析

　　最近做一个额照片上传后裁剪的功能，用到 jquery form的ajaxform提交图片保存，然后根据返回的JSON字符串直接在页面上显示出上传的照片，并且使用jcrop进行裁剪保存：JS代码如下

　　$('#form_portrait').ajaxForm({dataType: 'json', success: function(json) {if(json.img){$('#f_portrait_temp').attr("width",json.width);$('#f_portrait_temp').attr("height",json.height);$('#f_portrait_temp').attr("src","${base}"+json.img + " r="+Math.random());$('#img_imgSrcPath').attr("value",json.img);$('#f_portrait_temp').show();$('#f_portrait_temp').ready(function(){ var api = jQuery.Jcrop('#f_portrait_temp',{ setSelect: [ 20, 20, 128, 155 ], aspectRatio: 4/5, onChange: showCoords, onSelect: showCoords });$('#btn_upload').hide();$('#btn_saves').show();});}else if(json.msg) alert(json.msg); } });

　　使用firefox和google 浏览器都很正常，firebug也能看到返回的json和图片裁剪也很正常，但唯独IE浏览器不行，点击上传按钮的时候浏览器直接弹出来下载请求页面，把json数据变成了下载文件，换了很多版本的jquery和form插件都不行。使用ajaxForm提交表单上传文件后服务器端返回json数据IE浏览器无法解析，到后来跟踪一个网站同样地功能才找到问题所在，原来使用ajaxForm,必须以html格式返回json数据. 也就是 response.setContentType("text/html; charset=utf-8"); 这样返回的数据才能被设置到回调函数里面. 而且貌似格式必须是 "key":"value" 也就是双引号,单引号还不行，这算不算一个bug呢？明明

　　dataType: 'json',

　　却要返回html。

　　RenderUtils.renderHtml(response, json.toString(), "no-cache:false");

表单中带有 <input type="file" >文件类型的输入框则使用ajaxForm时会自动将Content-Type设置为文件上传的，这会导致Springmvc框架无法获取到表单数据，正常的接收头 Content-Type application/x-www-form-urlencoded; charset=UTF-8