`

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

    博客分类:
  • ajax
阅读更多
jquery的ajax()函数传值中文乱码解决方法介绍,需要的朋友可以参考下
 
<iframe id="cproIframe_u2298924_2" src="http://pos.baidu.com/acom?adn=3&amp;adp=1&amp;at=0&amp;aurl=&amp;c01=1&amp;cad=1&amp;ccd=24&amp;cec=GBK&amp;cfv=15&amp;ch=0&amp;col=zh-CN&amp;conBW=0&amp;conOP=1&amp;cpa=1&amp;cpro_lu=1%2C%23dfe4f9%2C%23000000%2C%E5%AE%8B%E4%BD%93&amp;dai=2&amp;dis=0&amp;layout_filter=image&amp;ltr=https%3A%2F%2Fwww.baidu.com%2Flink%3Furl%3DVxxd05LuAtqrdzLWQIEwStKOaVX_o1f07mAZZHvjgVWcJ0abhQvr9dUpqNi0QDKd%26wd%3D%26eqid%3Da3683b5b000eedf80000000555f24d3c&amp;ltu=http%3A%2F%2Fwww.jb51.net%2Farticle%2F31791.htm&amp;lu_161=0&amp;lunum=6&amp;n=jb51_cpr&amp;pat=1&amp;pcs=1903x955&amp;pih=80&amp;pis=10000x10000&amp;piw=130&amp;ps=491x486&amp;psr=1920x1080&amp;pss=1903x492&amp;ptbg=90&amp;ptp=0&amp;ptt=0&amp;qn=d4d4996019358114&amp;rad=&amp;rsi0=650&amp;rsi1=200&amp;rsi5=4&amp;rss0=%23FFFFFF&amp;rss1=%23FFFFFF&amp;rss2=%23000000&amp;rss3=%23444444&amp;rss4=%23008000&amp;rss5=&amp;rss6=%23e10900&amp;rss7=&amp;scale=&amp;skin=tabcloud_skin_5&amp;stid=5&amp;td_id=2298924&amp;tft=0&amp;titFF=%25E5%25BE%25AE%25E8%25BD%25AF%25E9%259B%2585%25E9%25BB%2591&amp;titFS=14&amp;titSU=0&amp;titTA=left&amp;tlt=0&amp;tn=baiduCustNativeAD&amp;tpr=1441943749714&amp;ts=1&amp;version=2.0&amp;xuanting=0&amp;dtm=BAIDU_DUP2_SETJSONADSLOT&amp;dc=2&amp;di=u2298924&amp;ti=jquery%E7%9A%84ajax()%E5%87%BD%E6%95%B0%E4%BC%A0%E5%80%BC%E4%B8%AD%E6%96%87%E4%B9%B1%E7%A0%81%E8%A7%A3%E5%86%B3%E6%96%B9%E6%B3%95%E4%BB%8B%E7%BB%8D_jquery_%E8%84%9A%E6%9C%AC%E4%B9%8B%E5%AE%B6&amp;tt=1441943749706.66.116.117" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" align="center,center" width="650" height="200"></iframe>
复制代码代码如下:

$.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); 
分享到:
评论

相关推荐

    Asp中使用JQuery的AJAX提交中文乱码解决方法

    主要介绍了Asp中使用JQuery的AJAX提交中文乱码解决方法,使用Asp中的unescape() 和escape() 函数即可解决乱码问题,需要的朋友可以参考下

    解决ajax回调函数返回的字符串乱码问题

    ServletActionContext.getResponse().setContentType(“text/json;... 您可能感兴趣的文章:jQuery Ajax Post 回调函数不执行问题的解决方法Javascript基于AJAX回调函数传递参数实例分析ajax回调函数中使用$(this)取不到

    JQuery AJAX 中文乱码问题解决

     对提交的数据调用JQuery函数encodeURI进行编码再提交或显示或链接既可  url = encodeURI(url); //url为数据。  注:注意浏览器和发布的项目的缓存问题,很多时候会影响解决。 记事本默认gbk编码

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

    本文实例讲述了JQuery中Post传递中文出现的解决方法,即乱码ajax与jquery.ajax中文参数post传递乱码处理方法。分享给大家供大家参考。具体分析如下: 问题一: 今天在做项目时,需要用到Ajax,之前我在用GET方式传递...

    JQuery异步获取返回值中文乱码的解决方法

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

    jquery+ajax无刷新评论源码

    客户端用escape()函数编码含中文的字符串,服务器端用unescape()解码,这样做是为了防止乱码,如果你采用的是utf8, 那就不必了,设置正确的页面编码和服务端脚本编码就不会出问题。由于jquery默认使用utf8传输数据...

    jQuery中$.get、$.post、$.getJSON和$.ajax的用法详解

    当我们用javascript写ajax程序写得很“开心”的时候,突然有人告诉你有一种东西叫jquery,它会告诉你不直接和HttpRequest是多么的快乐,同时你再也不需要再烦恼纠结的ajax乱码问题,更幸福的是你的js代码将大大地...

    ExtJS4中文教程2 开发笔记 chm

    JQuery AJAX提交中文乱码的解决方案 Jquery css函数用法 JQuery中getJSON的使用方法 Jquery中显示隐藏的实现代码分析 JQuery全选功能的实现 JQuery特效——下拉菜单 JQuery系列教程之XPath选择符 JQuery系列教程之...

    Java面试宝典2020修订版V1.0.1.doc

    14、JSP乱码如何解决? 36 15、session 和 application的区别? 36 16、jsp有哪些内置对象?作用分别是什么? 36 17、Jsp有哪些动作?作用分别是什么? 37 18、JSP中动态INCLUDE与静态INCLUDE的区别? 37 19、JSP和...

    Java学习笔记-个人整理的

    {1.7}方法}{26}{section.1.7} {1.8}运算符}{27}{section.1.8} {1.8.1}自增运算}{28}{subsection.1.8.1} {1.8.1.1}Postincrement}{28}{subsubsection.1.8.1.1} {1.8.1.2}Preincrement}{28}{subsubsection.1.8....

    文章管理系统

    1.纠正后台AJAX函数的加载图路径错误BUG 2.宇初验证码换成印象码 3.纠正后台引导页可能会被安全狗屏蔽的问题 4.自动完善内容页正文里的图片alt和title属性值 5.纠正富媒体验证码浮层层级问题 6.改进后台首页HTML代码...

Global site tag (gtag.js) - Google Analytics