真正的JQuery.ajax传递中文参数的解决方法


Posted in Javascript onMay 28, 2011

本人最近也遇到了需要传递中文参数的问题。在网上搜索一下,复制粘贴发的到处都是的“终极”“解决方案”无非就是escape(str)来转码,然后在服务端还要写个方法再编辑一次,或用System.Text.Encoding下的方法来换来换去。

我很久以前一直在使用Prototype框架。在.net-GB2312或jsp-utf8下都使用过,从来没遇到有字符编码的问题。于是将Prototype和JQuery代码都下载下来打开研究原因。具体结果如下

真正的JQuery.ajax传递中文参数的解决方法
不同之处在于JQuery默认的contentType:application/x-www-form-urlencoded
而Prototype则是contentType:application/x-www-form-urlencoded; charset=UTF-8
这才是JQuery正在乱码的原因,在未指定字符集的时候,是使用ISO-8859-1
ISO8859-1,通常叫做Latin-1。Latin-1包括了书写所有西方欧洲语言不可缺少的附加字符。
JQuery的Ajax根本没有考虑到国际化的问题,使用了欧洲的字符集,所以才引起了传递中文出现乱码的问题。
而我们的UTF-8则可以解决这一问题。
最终指需要修改JQuery的代码,显式声明contentType使用utf-8字符集,即可解决GB2312中文传递的问题。
修改如图:

真正的JQuery.ajax传递中文参数的解决方法
只需要简单的将JQuery的代码加以修改,加上charset=UTF-8就可以了,这样不需要改变改什么web.config或什么在页面中改编码什么的了,也不需要用escapc(str)再在服务端解码。英文怎么传递,中文也怎么传递。
给段简单的代码测试一下:
test.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title></title> 
<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
function DoAjax(){ 
$.post("AjaxTest.aspx",{txt:$("#tbox1").val()}, 
function(data){ 
$("#AjaxResponse").text(data); 
} 
); 
} 
</script> 
</head> 
<body> 
<p><a href="javascript:DoAjax();">AjaxTest</a><input name="tbox1" id="tbox1" type="text" /></p> 
<div id="AjaxResponse"></div> 
</body> 
</html>

AjaxTest.aspx:
<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="gb2312" %> 
<script runat="server"> 
string parms; 
void Page_Load(object sender , EventArgs e) 
{ 
parms=Request["txt"]; 
if (String.IsNullOrEmpty(parms)){ 
Response.Write("Is Null"); 
}else{ 
Response.Write(parms); 
} 
} 
</script>
Javascript 相关文章推荐
理解JavaScript的prototype属性
Feb 11 Javascript
javascript中call和apply方法浅谈
Sep 27 Javascript
jQuery中triggerHandler()方法用法实例
Jan 19 Javascript
JS+CSS实现可拖动的弹出提示框
Feb 16 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
js实现把时间戳转换为yyyy-MM-dd hh:mm 格式(es6语法)
Dec 28 Javascript
深入浅析Vue中的Prop
Jun 10 Javascript
React Router V4使用指南(精讲)
Sep 17 Javascript
javascript实现切割轮播效果
Nov 28 Javascript
vue实现自定义多选按钮
Jul 16 Javascript
JS实现页面鼠标点击出现图片特效
Aug 19 Javascript
js前端图片加载异常兜底方案
Jun 21 Javascript
jquery 图片上传按比例预览插件集合
May 28 #Javascript
使用jquery实现select添加实现后台权限添加的效果
May 28 #Javascript
jQuery 源码分析笔记(2) 变量列表
May 28 #Javascript
Jquery下:nth-child(an+b)的使用注意
May 28 #Javascript
鼠标滑上去后图片放大浮出效果的js代码
May 28 #Javascript
js原生态函数中使用jQuery中的 $(this)无效的解决方法
May 25 #Javascript
actionscript与javascript的区别
May 25 #Javascript
You might like
打造计数器DIY三步曲(下)
2006/10/09 PHP
php中拷贝构造函数、赋值运算符重载
2012/07/25 PHP
PHP中spl_autoload_register()和__autoload()区别分析
2014/05/10 PHP
Yii基于CActiveForm的Ajax数据验证用法示例
2016/07/14 PHP
PHP简单读取PDF页数的实现方法
2016/07/21 PHP
Ext JS Grid在IE6 下宽度的问题解决方法
2009/02/15 Javascript
javascript DOM编程实例(智播客学习)
2009/11/23 Javascript
jQuery 添加/移除CSS类实现代码
2010/02/11 Javascript
Prototype源码浅析 Enumerable部分之each方法
2012/01/16 Javascript
jquery 删除cookie失效的解决方法
2013/11/12 Javascript
js实现百度联盟中一款不错的图片切换效果完整实例
2015/03/04 Javascript
基于jquery实现放大镜效果
2015/08/17 Javascript
JS平滑无缝滚动效果的实现代码
2016/05/06 Javascript
JS快速实现移动端拼图游戏
2016/09/05 Javascript
细数JavaScript 一个等号,两个等号,三个等号的区别
2016/10/09 Javascript
jQuery展示表格点击变色、全选、删除
2017/01/05 Javascript
JavaScript中Hoisting详解 (变量提升与函数声明提升)
2017/08/18 Javascript
vue语法之拼接字符串的示例代码
2017/10/25 Javascript
vue响应式更新机制及不使用框架实现简单的数据双向绑定问题
2019/06/27 Javascript
Python中二维列表如何获取子区域元素的组成
2017/01/19 Python
python实现屏保程序(适用于背单词)
2019/07/30 Python
在Pytorch中使用样本权重(sample_weight)的正确方法
2019/08/17 Python
快速解决docker-py api版本不兼容的问题
2019/08/30 Python
python爬虫实例之获取动漫截图
2020/05/31 Python
python爬取网易云音乐热歌榜实例代码
2020/08/07 Python
python 调用API接口 获取和解析 Json数据
2020/09/28 Python
css3圆角样式分享自定义按钮样式
2013/12/27 HTML / CSS
VSCode 自定义html5模板的实现
2019/12/05 HTML / CSS
95%的面试官都会问到的50道Java线程题,附答案
2012/08/03 面试题
护士求职推荐信范文
2013/11/23 职场文书
细节决定成败演讲稿
2014/05/12 职场文书
起诉书范文
2015/05/20 职场文书
2016年中学端午节主题活动总结
2016/04/01 职场文书
试用1103暨1103、1101同门大比武 [ DAIWEI ]
2022/04/05 无线电
《群青的幻想曲》京力秋树角色PV公开
2022/04/08 日漫
使用opencv-python如何打开USB或者笔记本前置摄像头
2022/06/21 Python