博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ajaxForm问题集锦,一个神奇的问题:使用ajaxForm提交表单上传文件后服务器端返回json数据IE浏览器无法解析...
阅读量:5866 次
发布时间:2019-06-19

本文共 1652 字,大约阅读时间需要 5 分钟。

hot3.png

  •      最近做一个额照片上传后裁剪的功能,用到 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

 

 

还有一个插件有类似的问题

 

contentType参数是一定要有的,否则浏览器总是提示将返回的JSON结果另存为文件,不会交给ajaxfileupload处理。这是因为struts2 JSON Plugin默认的contentType为application/json,而ajaxfileupload则要求为text/html。

 

转载于:https://my.oschina.net/usenrong/blog/197872

你可能感兴趣的文章
js判断checkbox是否选中
查看>>
多系统盘挂载
查看>>
MySQL函数怎么加锁_MYSQL 函数调用导致自动生成共享锁问题
查看>>
MR1和MR2的工作原理
查看>>
Eclipse中修改代码格式
查看>>
GRUB Legacy
查看>>
关于 error: LINK1123: failure during conversion to COFF: file invalid or corrupt 错误的解决方案...
查看>>
hexo博客解决不蒜子统计无法显示问题
查看>>
python实现链表
查看>>
java查找string1和string2是不是含有相同的字母种类和数量(string1是否是string2的重新组合)...
查看>>
Android TabActivity使用方法
查看>>
java ShutdownHook介绍与使用
查看>>
Eclipse的 window-->preferences里面没有Android选项
查看>>
《麦田里的守望者》--[美]杰罗姆·大卫·塞林格
查看>>
遇到的那些坑
查看>>
央行下属的上海资信网络金融征信系统(NFCS)签约机构数量突破800家
查看>>
[转] Lazy evaluation
查看>>
常用查找算法总结
查看>>
grep 零宽断言
查看>>
被神话的大数据——从大数据(big data)到深度数据(deep data)思维转变
查看>>