JQuery的Ajax中Post方法传递中文出现乱码的解决方法


Posted in Javascript onOctober 21, 2014

本文实例讲述了JQuery中Post传递中文出现的解决方法,即乱码ajax与jquery.ajax中文参数post传递乱码处理方法。分享给大家供大家参考。具体分析如下:

问题一:

今天在做项目时,需要用到Ajax,之前我在用GET方式传递中文参数时,只需要在后台程序中设置页面编码为GB2312即中文能正常显示,可是这次由于表单项目较多,不适合用GET方式传递,只能用POST方式,但发现后台程序中设置编码为GB2312时中文还是显示的乱码。经过一番研究问题才最终得到解决。

解决方法:

解决此问题的方法非常简单,只需要在JS处理参数时用escape()函数处理一下即可,而且不需要再用unescape()解码,这个方法适合POST和GET方式,具体的Ajax代码这里我不例出,这里给出用escape()函数处理参数时的代码:

var htmer ="getcode="+escape(getcode)+"&Content="+escape(Content);
 

通常我们在处理Ajax的时候会在这里直接获取参数的值,为了使中文参数不是乱码,我们只需要用escape()函数对参数处理下即可。

问题二:

当网站页面不是utf-8编码时,ajax提交的中文便会变成乱码。

解决方法如下:

找到jquery.js里的contentType:application/x-www-form-urlencoded,将它改成contentType:application/x-www-form-urlencoded; charset=UTF-8就可以了。

原因:未指定charset时,jquery使用ISO-8859-1,ISO8859-1,通常叫做Latin-1。Latin-1包括了书写所有西方欧洲语言不可缺少的附加字符。jquery的ajax根本没有考虑到国际化的问题,而使用了欧洲的字符集,所以传递中文时才会出现乱码

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

不同之处在于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的代码加以修改,加上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/网页特效" 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>

此外,由于Ajax的默认汉字编码是utf-8,因此比较保险的方法是保证所涉及的页面统一编码格式为utf-8。

希望本文所述对大家基于的jQuery的Ajax程序设计有所帮助。

Javascript 相关文章推荐
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 Javascript
javascript重复绑定事件造成的后果说明
Mar 02 Javascript
jquery实现图片翻页效果
Dec 23 Javascript
js实现网页标题栏闪烁提示效果实例分析
Nov 20 Javascript
深入分析下javascript中的[]()+!
Jul 07 Javascript
JavaScript中利用Array和Object实现Map的方法
Jul 27 Javascript
使用JQuery实现的分页插件分享
Nov 05 Javascript
JS实现获取剪贴板内容的方法
Jun 21 Javascript
js如何判断是否在iframe中及防止网页被别站用iframe嵌套
Jan 11 Javascript
vue轻量级框架无法获取到vue对象解决方法
May 12 Javascript
echarts柱状图背景重叠组合而非并列的实现代码
Dec 10 Javascript
javascript canvas实现雨滴效果
Jun 09 Javascript
jquery中post方法用法实例
Oct 21 #Javascript
js调试工具Console命令详解
Oct 21 #Javascript
JS中FRAME的操作问题实例分析
Oct 21 #Javascript
用Jquery.load载入页面后样式没了页面混乱的解决方法
Oct 20 #Javascript
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 #Javascript
利用jquery操作Radio方法小结
Oct 20 #Javascript
利用a标签自动解析URL分析网址实例
Oct 20 #Javascript
You might like
关于php curl获取301或302转向的网址问题的解决方法
2011/06/02 PHP
php源代码安装常见错误与解决办法分享
2013/05/28 PHP
PHP实现事件机制的方法
2015/07/10 PHP
javascript 字符串连接的性能问题(多浏览器)
2008/11/18 Javascript
jQuery 性能优化指南(2)
2009/05/21 Javascript
XENON基于JSON变种
2010/07/27 Javascript
jquery插件制作 提示框插件实现代码
2012/08/17 Javascript
jquery实现的鼠标下拉滚动置顶效果
2014/07/24 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
jQuery动态添加及删除表单上传元素的方法(附demo源码下载)
2016/01/15 Javascript
详解js中常规日期格式处理、月历渲染和倒计时函数
2016/12/28 Javascript
three.js实现围绕某物体旋转
2017/01/25 Javascript
Node连接mysql数据库方法介绍
2017/02/07 Javascript
jQuery 实现鼠标画框并对框内数据选中的实例代码
2017/08/29 jQuery
详解微信小程序-扫一扫 wx.scanCode() 扫码大变身
2019/04/30 Javascript
为什么Vue3.0使用Proxy实现数据监听(defineProperty表示不背这个锅)
2019/10/14 Javascript
uniapp,微信小程序中使用 MQTT的问题
2020/07/11 Javascript
jQuery实现朋友圈查看图片
2020/09/11 jQuery
[46:21]Liquid vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
基于python批量处理dat文件及科学计算方法详解
2018/05/08 Python
正确理解Python中if __name__ == '__main__'
2019/01/24 Python
python 解决tqdm模块不能单行显示的问题
2020/02/19 Python
python字典的值可以修改吗
2020/06/29 Python
为2021年的第一场雪锦上添花:用matplotlib绘制雪花和雪景
2021/01/05 Python
HTML5中indexedDB 数据库的使用实例
2017/05/11 HTML / CSS
Gap英国官网:Gap UK
2018/07/18 全球购物
澳大利亚当地最大的时装生产商:Cue
2018/08/06 全球购物
莫斯科珠宝厂官方网站:Miuz
2020/09/19 全球购物
医学生自荐信范文
2013/12/03 职场文书
市场部管理制度
2014/02/02 职场文书
关于安全的标语
2014/06/10 职场文书
房地产经营管理专业自荐信
2014/09/02 职场文书
旅游局领导班子“四风”问题对照检查材料思想汇报
2014/09/29 职场文书
python OpenCV学习笔记
2021/03/31 Python
vue组件vue-esign实现电子签名
2022/04/21 Vue.js
HTML5之高度塌陷问题的解决
2022/06/01 HTML / CSS