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 相关文章推荐
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
Jul 25 Javascript
屏蔽F1~F12的快捷键的js函数
May 06 Javascript
解析javascript中鼠标滚轮事件
May 26 Javascript
JS实现页面内跳转的简单代码
Sep 03 Javascript
基于iScroll实现内容滚动效果
Mar 21 Javascript
vue-cli3使用 DllPlugin 实现预编译提升构建速度
Apr 24 Javascript
angular 服务随记小结
May 06 Javascript
解决Vue动态加载本地图片问题
Oct 09 Javascript
在Express中提供静态文件的实现方法
Oct 17 Javascript
原生js生成图片验证码
Oct 11 Javascript
微信小程序tab左右滑动切换功能的实现代码
Feb 08 Javascript
Vue组件化(ref,props, mixin,.插件)详解
May 15 Vue.js
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
如何做到多笔资料的同步
2006/10/09 PHP
PHP制作图形验证码代码分享
2014/10/23 PHP
PHP中if和or运行效率对比
2014/12/12 PHP
PHP中in_array函数使用的问题与解决办法
2016/09/11 PHP
JS的数组的扩展实例代码
2008/07/09 Javascript
Javascript !!的作用
2008/12/04 Javascript
一款js和css代码压缩工具[附JAVA环境配置方法]
2010/04/16 Javascript
jqGrid增加时--判断开始日期与结束日期(实例解析)
2013/11/08 Javascript
关于Bootstrap弹出框无法调用问题的解决办法
2016/03/10 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
jQuery实现的简单拖拽功能示例
2016/09/13 Javascript
基于Three.js插件制作360度全景图
2016/11/29 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
2017/06/28 Javascript
jQuery条件分页 代替离线查询(附代码)
2017/08/17 jQuery
vue.js组件vue-waterfall-easy实现瀑布流效果
2017/08/22 Javascript
jQuery实现的文字逐行向上间歇滚动效果示例
2017/09/06 jQuery
Vue实现数字输入框中分割手机号码的示例
2017/10/10 Javascript
Vue+jquery实现表格指定列的文字收缩的示例代码
2018/01/09 jQuery
uni-app微信小程序登录授权的实现
2020/05/22 Javascript
jQuery开发仿QQ版音乐播放器
2020/07/10 jQuery
Python程序包的构建和发布过程示例详解
2019/06/09 Python
Pytorch 实现计算分类器准确率(总分类及子分类)
2020/01/18 Python
PYQT5 vscode联合操作qtdesigner的方法
2020/03/24 Python
Django创建一个后台的基本步骤记录
2020/10/02 Python
全天然狗零食:Best Bully Sticks
2016/09/22 全球购物
华为俄罗斯官方网上商城:购买Huawei手机和平板
2017/04/21 全球购物
TALLY WEiJL法国网上商店:服装、时装及配饰
2019/08/31 全球购物
北京RT科技有限公司.net工程师面试题
2013/02/15 面试题
酒吧总经理岗位职责
2013/12/10 职场文书
运动会解说词200字
2014/02/06 职场文书
四年大学生活的自我评价范文
2014/02/07 职场文书
剪枝的学问教学反思
2014/02/07 职场文书
2016七夕情人节感言
2015/12/09 职场文书
护士医德医风心得体会
2016/01/25 职场文书
css position fixed 左右双定位的实现代码
2021/04/29 HTML / CSS
Python如何让字典保持有序排列
2022/04/29 Python