`
usenrong
  • 浏览: 515016 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

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

 

 

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

jquery插件ajaxfileupload 不能解析服务器端响应的json

 

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

 

分享到:
评论
3 楼 heroyanglei 2012-11-29  
Thanks a billion,我也碰到了同样的问题,在上传文件的时候发生的。
2 楼 wise_wei 2012-04-06  
嗯,遇到同样的问题。学习了!
而且还遇到一个问题就是如果:renderText("aaaa");那么在Firefox和chrome接收时会接收<pre>aaaa</pre>和
<pre style="word-wrap: break-word; white-space: pre-wrap;">aaaa</pre>。很疑惑……
1 楼 Mojarra 2012-03-04  
多谢,解决我刚才碰到的与这个同样的问题

相关推荐

    tables-3.6.1-cp39-cp39-win_amd64.whl

    tables-3.6.1-cp39-cp39-win_amd64.whl

    基于springboot大学生心理咨询平台源码数据库文档.zip

    基于springboot大学生心理咨询平台源码数据库文档.zip

    Javaweb仓库管理系统项目源码.zip

    基于Java web 实现的仓库管理系统源码,适用于初学者了解Java web的开发过程以及仓库管理系统的实现。

    基于springboot智能推荐旅游平台源码数据库文档.zip

    基于springboot智能推荐旅游平台源码数据库文档.zip

    Ruby语言教程:从基础知识到高级特性的全面指南

    内容概要:本文是一份详尽的Ruby语言教程,首先介绍了Ruby语言的基本信息和发展背景。接着详细讲解了Ruby的基础语法,如变量、数据类型、运算符、控制流等,并深入探讨了面向对象编程的关键概念,包括类、对象、继承、封装和多态。随后介绍了Ruby的一些高级特性,如模块、异常处理、迭代器和文件I/O操作。最后,讨论了Ruby在Web开发中的应用,尤其是与Rails框架的结合。每个部分都配有相应的代码示例,帮助读者更好地理解和实践。 适合人群:适用于初学者和有一定基础的程序员,特别是对Ruby语言感兴趣的人。 使用场景及目标:学习和掌握Ruby语言的各项基础知识和高级特性,为进一步进行Web开发或其他相关编程打下坚实的基础。 其他说明:教程中的每一部分内容都有详细的解释和代码示例,非常适合自学和教学使用。

    L7_NDVI_sd.txt

    GEE训练教程——Landsat5、8和Sentinel-2、DEM和各2哦想指数下载

    基于springboot在线问诊系统源码数据库文档.zip

    基于springboot在线问诊系统源码数据库文档.zip

    基于springboot的流浪猫狗救助系统源码数据库文档.zip

    基于springboot的流浪猫狗救助系统源码数据库文档.zip

    value_at_a_point.ipynb

    GEE训练教程

    毕业设计&课设_利用 WiFi 实现室内定位,含定位 APP 与数据采集 APP.zip

    该资源内项目源码是个人的课程设计、毕业设计,代码都测试ok,都是运行成功后才上传资源,答辩评审平均分达到96分,放心下载使用! ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。

    SQLite参考手册中文CHM版最新版本

    本教程帮助您了解什么是 SQLite,它与 SQL 之间的不同,为什么需要它,以及它的应用程序数据库处理方式。需要的朋友们可以参考看看! SQLite是一个软件库,实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。SQLite是一个增长最快的数据库引擎,这是在普及方面的增长,与它的尺寸大小无关。SQLite 源代码不受版权限制。 什么是 SQLite? SQLite是一个进程内的库,实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。它是一个零配置的数据库,这意味着与其他数据库一样,您不需要在系统中配置。 就像其他数据库,SQLite 引擎不是一个独立的进程,可以按应用程序需求进行静态或动态连接。SQLite 直接访问其存储文件。 为什么要用 SQLite? 不需要一个单独的服务器进程或操作的系统(无服务器的)。 SQLite 不需要配置,这意味着不需要安装或管理。 一个完整的 SQLite 数据库是存储在一个单一的跨平台的磁盘文件。 SQLite 是非常小的,是轻量级的,完全配置时小于 400KiB,省略可选功能配置时小于250K

    基于springboot学生选课系统源码数据库文档.zip

    基于springboot学生选课系统源码数据库文档.zip

    【Android UI】SurfaceView中使用 Canvas 绘制可缩放大图

    【Android UI】SurfaceView中使用 Canvas 绘制可缩放大图 ( 拖动和缩放相关的变量 | Canvas 绘图函数 | 手势识别 多点触控流程 | 拖动图片 | 缩放图片 ) 博客链接:https://blog.csdn.net/shulianghan/article/details/143950948 一、需求分析 和 核心要点 说明 1、需求说明 2、核心要点 - 拖动和缩放相关的变量 3、核心要点 - Canvas 绘图函数 4、核心要点 - 手势识别 多点触控流程 5、核心要点 - 拖动图片 6、核心要点 - 缩放图片 二、完整代码示例 1、环境说明 2、SurfaceView 完整代码 3、运行结果

    基于springboot+web的二手闲置交易系统源码数据库文档.zip

    基于springboot+web的二手闲置交易系统源码数据库文档.zip

    band_computations.ipynb

    GEE训练教程

    毕业设计&课设_众筹平台系统,基于基础语言开发,含功能流程与运行步骤,适合新手学习借鉴.zip

    该资源内项目源码是个人的课程设计、毕业设计,代码都测试ok,都是运行成功后才上传资源,答辩评审平均分达到96分,放心下载使用! ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。

    基于SpringBoot的宠物寄领养网站源码数据库文档.zip

    基于SpringBoot的宠物寄领养网站源码数据库文档.zip

    基于springboot的电影院售票管理系统源码数据库文档.zip

    基于springboot的电影院售票管理系统源码数据库文档.zip

    毕业设计&课设_含构建设置及相关操作,基于特定技术,具体功能未详细说明.zip

    该资源内项目源码是个人的课程设计、毕业设计,代码都测试ok,都是运行成功后才上传资源,答辩评审平均分达到96分,放心下载使用! ## 项目备注 1、该资源内项目代码都经过严格测试运行成功才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。

    工具变量上市公司企业银行贷款数据(2019-2024年).txt

    数据存放网盘,txt文件内包含下载链接及提取码,永久有效。失效会第一时间进行补充。样例数据及详细介绍参见文章:https://blog.csdn.net/T0620514/article/details/143956923

Global site tag (gtag.js) - Google Analytics