JQuery AJAX提交中文乱码的解决方案


Posted in Javascript onJuly 02, 2010

现象如下:

1)在Firefox下,处理页面的编码为gb2312,提交数据没有问题,中文能够正确解析;

2)在IE8下,处理页面的编码为gb2312,提交中文数据出现乱码。

无论是$.post还是$.ajax,抑或$.ajaxSubmit(来自于Form插件),在之前的UTF-8编码的网站都没有出现过任何问题, 看来是由于提交数据的网页的编码格式造成的了。不管怎么样,既然是浏览器之间存在差异,还是从HTTP包来看有什么问题吧。

打开Fiddle,分别用Firefox和IE做一个AJAX提交(以用户登录为例),检查他们的HTTP头,发现

1)两个浏览器提交的Form数据是一致的,都是进行了UTF-8的编码,如下图所示。

JQuery AJAX提交中文乱码的解决方案

分析:JQuery的AJAX提交,会将要提交的数据进行编码,使用encodeURIComponent在js中处理数据。因此,无论是 Firefox或者IE,提交的数据都是一致的,都是UTF-8编码后的数据。

2)查看Header,发现Entity中的Content-Type存在差异

在Firefox中,Content-Type指定了字符集为utf-8。

JQuery AJAX提交中文乱码的解决方案

而在IE8中,却没有任何的字符集指定。

JQuery AJAX提交中文乱码的解决方案

分析:显然,默认情况下,AJAX的异步提交的字符编码应该和网页本身保持一致,也就是说,Server端在没有发现显示的charset指定的情 况下,使用gb2312来解码数据(但是数据在提交前已经被UTF-8编码了),这就是为什么在IE下会出现乱码的根源,而在Firefox下,浏览器在 提交AJAX数据的时候,加上了charset的显示指定,导致Server端采用UTF-8来解码数据(正确解码)。

推断:看来要解决这个中文乱码问题,就必须给AJAX异步提交指定显 示的charset!

马上查阅JQuery的AJAX工具函数的说明,发现options中有一个指定content-type的参数,给我的AJAX代码加上:

jQuery(form).ajaxSubmit({ 
url: "ajax.aspx?a=memberlogin", 
type: "post", 
dataType: "json", 
contentType: "application/x-www-form-urlencoded; charset=utf-8", 
success: showLoginResponse 
});

测试,OK!!!
Javascript 相关文章推荐
用javascript做拖动布局的思路
May 31 Javascript
JavaScript 图像动画的小demo
May 23 Javascript
jQuery在ul中显示某个li索引号的方法
Mar 17 Javascript
JS使用正则截取两个字符串之间的字符串实现方法详解
Jan 06 Javascript
jQuery validate 验证radio实例
Mar 01 Javascript
seajs实现强制刷新本地缓存的方法分析
Oct 16 Javascript
javascript实现电脑和手机版样式切换
Nov 10 Javascript
vue.js实现的幻灯片功能示例
Jan 18 Javascript
彻底揭秘keep-alive原理(小结)
May 05 Javascript
为react组件库添加typescript类型提示的方法
Jun 15 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
在antd中setFieldsValue和defaultVal的用法
Oct 29 Javascript
IE本地存储userdata的一个bug说明
Jul 01 #Javascript
UserData用法总结 lanyu出品
Jul 01 #Javascript
javascript 函数调用的对象和方法
Jul 01 #Javascript
this和执行上下文实现代码
Jul 01 #Javascript
jquery.validate使用攻略 第五步 正则验证
Jul 01 #Javascript
jquery validate使用攻略 第四步
Jul 01 #Javascript
jquery.validate使用攻略 第三部
Jul 01 #Javascript
You might like
php使用pdo连接报错Connection failed SQLSTATE的解决方法
2014/12/15 PHP
php限制上传文件类型并保存上传文件的方法
2015/03/13 PHP
PHP-X系列教程之内置函数的使用示例
2017/10/16 PHP
php获取ajax的headers方法与内容实例
2017/12/27 PHP
Django中通过定时任务触发页面静态化的处理方式
2018/08/29 PHP
yii框架使用分页的方法分析
2019/07/25 PHP
实例讲解PHP表单
2020/06/10 PHP
经验几则 推荐
2006/09/05 Javascript
你的编程语言可以这样做吗?
2006/09/07 Javascript
JS焦点图切换,上下翻转
2011/05/12 Javascript
jquery实现一个简单好用的弹出框
2014/09/26 Javascript
JavaScript中的关联数组问题
2015/03/04 Javascript
Java Mybatis框架入门基础教程
2015/09/21 Javascript
谈谈我对JavaScript原型和闭包系列理解(随手笔记8)
2015/12/24 Javascript
jQuery插件 Jqplot图表实例
2016/06/18 Javascript
js 获取当前web应用的上下文路径实现方法
2016/08/19 Javascript
jQuery表格(Table)基本操作实例分析
2017/03/10 Javascript
详解nodejs微信公众号开发——2.自动回复
2017/04/10 NodeJs
详解Node.js开发中的express-session
2017/05/19 Javascript
微信小程序 Buffer缓冲区的详解
2017/07/06 Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
2018/08/19 Javascript
JavaScript实现预览本地上传图片功能完整示例
2019/03/08 Javascript
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
2019/09/10 jQuery
[05:01]3.19DOTA2发布会 我们都是刀塔人
2014/03/25 DOTA
[01:21:07]EG vs Liquid 2018国际邀请赛淘汰赛BO3 第一场 8.25
2018/08/29 DOTA
使用python中的in ,not in来检查元素是不是在列表中的方法
2018/07/06 Python
pandas分别写入excel的不同sheet方法
2018/12/11 Python
python opencv实现证件照换底功能
2019/08/19 Python
利用Python计算KS的实例详解
2020/03/03 Python
使用py-spy解决scrapy卡死的问题方法
2020/09/29 Python
Python模块常用四种安装方式
2020/10/20 Python
猫咪家具:CatsPlay
2018/11/03 全球购物
德国户外商店:eXXpozed
2020/07/25 全球购物
餐饮服务食品安全责任书
2014/07/25 职场文书
Python使用random模块实现掷骰子游戏的示例代码
2021/04/29 Python
如何利用Python实现n*n螺旋矩阵
2022/01/18 Python