文档章节

jquery的ajax()函数传值中文乱码解决方法介绍

mdoo
 mdoo
发布于 2015/10/07 22:04
字数 803
阅读 350
收藏 24

jquery的ajax()函数传值中文乱码解决方法介绍,需要的朋友可以参考下

代码如下:


$.ajax({
  dataType : ‘json',type : ‘POST',url : ‘http://localhost/test/test.do',data : {id: 1, type: ‘商品'},success : function(data){ } } );


问题:
提交后后台action程序时,取到的type是乱码
解决方法:
方法一:提交前采用encodeURI两次编码,记住一定是两次
1.修改以下代码

复制代码 代码如下:


data:{id:1, type:encodeURI(encodeURI(‘商品'))}


2.在后台action里要对取得的字符串进行decode
1、String type = request.getParameter(“type”);
2、type = URLDecoder.decode(type, “UTF-8″);
方法二:ajax配置contentType属性,加上charset=UTF-8
在ajax方法中加入以下参数
contentType: “application/x-www-form-urlencoded; charset=UTF-8″使用其它js框架或者xhr都是差不多,设置header中contentType即可,
这里关键是charset=UTF-8,如果没有这个,是不行的,默认jQuery里的contentType是没有的

一、测试环境
jQuery:1.3.2
tomcat:5.5.17
二、测试方法
1.使用get方式
服务器端java代码:

复制代码 代码如下:


String name = new String(request.getParameter("name").getBytes("iso8859-1"),"utf-8");


客户端js代码:

复制代码 代码如下:


$.ajax({url: "2.jsp",type: "get",data: {name:"中文"},success: function(response){
alert(response);
}});


结果:正确显示

复制代码 代码如下:


$.ajax({url: "2.jsp",type: "get",data: "name=中文",success: function(response){
alert(response);
}});


结果:乱码

复制代码 代码如下:


$.get("2.jsp", { name: "中文" },function(response){
alert(response);
});


结果:正确显示

复制代码 代码如下:


$.get("2.jsp", "name=中文",function(response){
alert(response);
});


结果:乱码

2.post方式
服务器端java代码:

复制代码 代码如下:


request.setCharacterEncoding("UTF-8");
String name = request.getParameter("name");


客户端js代码:

复制代码 代码如下:


$.ajax({url: "3.jsp",type: "post",data: "method=testAjaxPost&name=中文",success: function(response){
alert(response);
}});


结果:正确显示

复制代码 代码如下:


$.ajax({url: "3.jsp",type: "post",data: {name:"中文"},success: function(response){
alert(response);
}});


结果:正确显示

复制代码 代码如下:


$.post("3.jsp", { name: "中文" },function(response){
alert(response);
});


结果:正确显示

复制代码 代码如下:


$.post("3.jsp", "name=中文",function(response){
alert(response);
});


结果:正确显示
三、使用filter

复制代码 代码如下:


public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException, ServletException {
HttpServletRequest req = (HttpServletRequest) request;
if (req.getHeader("X-Requested-With") != null && req.getHeader("X-Requested-With").equalsIgnoreCase("XMLHttpRequest")) {
request.setCharacterEncoding("utf-8");
} else {
request.setCharacterEncoding("gbk");
}
chain.doFilter(request, response);
}


jQuery 在使用ajax的时候会在header中加入X-Requested-With,值为:XMLHttpRequest,filter中判断是jQuery 的ajax请求时就把字符编码设为utf8,这样可以解决post提交中的中文乱码问题,不需要在代码中设置 request.setCharacterEncoding("UTF-8");
对于get方式的中文乱码问题,建议不使用get方式提交中文,统统改为post ^-^

为了和prototype.js处理中文的方式一致,可以使用如下的方式,自定义header中的属性RequestType

复制代码 代码如下:


$.ajax({
url: "3.jsp",
type: "post",
data: {name:"中文"},
beforeSend: function(XMLHttpRequest){
XMLHttpRequest.setRequestHeader("RequestType", "ajax");
alert("开始");
},
success: function(data, textStatus){
alert(data);
},
error: function(XMLHttpRequest, textStatus, errorThrown){
alert("错误:" + textStatus);
},
complete: function(XMLHttpRequest, textStatus){
alert("完成:" + textStatus);
}
});


filter代码如下:

复制代码 代码如下:


public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException, ServletException {
HttpServletRequest req = (HttpServletRequest) request;
if (req.getHeader("RequestType") != null && req.getHeader("RequestType").equalsIgnoreCase("ajax"))) {
request.setCharacterEncoding("utf-8");
} else {
request.setCharacterEncoding("gbk");
}
chain.doFilter(request, response);
}


© 著作权归作者所有

mdoo
粉丝 9
博文 87
码字总数 60763
作品 0
淄博
私信 提问
加载中

评论(1)

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

1,在eclipse中引入jedis的jar包,在主方法中实验jedis的连接和存储数据,返回keys等,需要在cmd命令下开启redis服务端才可运行。 2,回顾之前学习的一部分Jquery,后继续在菜鸟教程学习jqu...

麦兜鱼丸
2017/05/10
2
0
jquery的 ajax返回值为中文时乱码解决方法

用jquery的ajax,遇到个问题,服务器端从数据库取到的数据没有出现中文乱码问题(日志打出来是没有乱码的),但是异步传到客户的时候却出现了乱码。 服务器端已经编码过了(UTF-8编码)。开始...

六六木木
2013/09/15
28.5K
4
jQuery Ajax传值给Servlet,在Servlet里Get接受参数乱码的解决方法

  最近在学jquery ui,在做一个小功能的时候需要将前台的值获取到,通过Ajax传递给Servlet,然后再在返回数据结果,但是在Servlet接受参数的时候,通过后台打印,发现接受乱码,代码示例如下...

gdy
2016/10/04
0
0
为什么utf-8编码在IE6下url传中文最后个字符会是乱码?

为什么utf-8编码在IE6下url传中文最后个字符会是乱码(字数是奇数时)?,其它浏览器就没有这个问题,tomcat也设置了编程为UTF-8,不知怎么解决, http://www.ablanxue.com/prone_4540_1.html...

huanlin08
2013/04/08
410
1
jquery ajax post提交数据乱码

在用jquery处理html5的应用的时候,一直在firefox下测试都正常,用户用pad访问的时候说有乱码, 自己试验了下果然,后发现chrome和ie内核下都是有此问题,此问题设置了页面属性为utf-8时候,...

猴亮屏
2014/11/25
150
0

没有更多内容

加载失败,请刷新页面

加载更多

黑客之道-40本书籍助你快速入门黑客技术免费下载

场景 黑客是一个中文词语,皆源自英文hacker,随着灰鸽子的出现,灰鸽子成为了很多假借黑客名义控制他人电脑的黑客技术,于是出现了“骇客”与"黑客"分家。2012年电影频道节目中心出品的电影...

badaoliumang
昨天
6
0
很遗憾,没有一篇文章能讲清楚线程的生命周期!

(手机横屏看源码更方便) 注:java源码分析部分如无特殊说明均基于 java8 版本。 简介 大家都知道线程是有生命周期,但是彤哥可以认真负责地告诉你网上几乎没有一篇文章讲得是完全正确的。 ...

彤哥读源码
昨天
9
0
jquery--DOM操作基础

本文转载于:专业的前端网站➭jquery--DOM操作基础 元素的访问 元素属性操作 获取:attr(name);$("#my").attr("src"); 设置:attr(name,value);$("#myImg").attr("src","images/1.jpg"); ......

前端老手
昨天
5
0
Django的ChoiceField和MultipleChoiceField错误提示,选择一个有效的选项

在表单验证时提示错误:选择一个有效的选项 例如有这样一个表单: class ProductForm(Form): category = fields.MultipleChoiceField( widget=widgets.SelectMultiple(), ...

编程老陆
昨天
9
0
Vue核心概念及特性 (一)

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。 > 特点: 易用,灵活,高效,渐进式框架。 > 可以随意组合需要用到的模块 vue + components + vue-router + vuex + v...

前端优选
昨天
14
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部