tinguo002

 

jquery form提交时中文乱码

jquery form提交时中文乱码
    博客分类:
  • java
在使用jsp开始时,一不小心就会出现中文乱码的情况。通常可以使用如下方法解决:
第一种解决方法:
从jsp到servlet统一使用utf-8编码.全部使用utf-8编码能省去很多麻烦,但一点不足是utf-8编码对汉字是使用3-4个字节,会加大网络传输量。
第二种方法:
1.jsp页面使用GBK
2.使用servlet过滤器设置request.setCharacterEncoding("GBK");google一下就能找到很多怎么使用过滤器转换编码。
以上两种方法能解决大部分的乱码问题,特别是第一种方法,能解决使用ajax提交时的中文乱码问题。如果采用第二种方法,那么在使用ajax提交表单时仍然会有中文乱码。这是因为ajax方式提交时js使用的是utf-8的编码,过滤器使用gbk进行转码就不正确了,应该使用utf-8进行转码。要解决这个问题,网上也有很多个版本,其中一个是我曾经采用的在客户端使用encodeURI,然后再在服务器端进行URLDecoder.decode,这种方案在偶尔处理一下中文是可行的,但是如果页面有大量数据录入,那么这种方案是不可行的。有没有好的解决方法呢?在经过新一轮的google之后,还是找到了方法。参考http://www.iteye.com/topic/157698?page=1。原理就是根据httpheader中的内容来区分是ajax方式请求还是普通的请求。在jquery1.2.6中,ajaxSettings默认设置contentType为"application/x-www-form-urlencoded",在ajax方法中设置xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");,我们只要在servlet中根据这两个参数值来判断是不是通过xmlhttprequest发起的请求。这里值得一提的是jquery在提交form时对参数进行了encodeURIComponent调用,参见param方法
Java代码 复制代码 收藏代码
  1. jQuery.each( a, function(){ 
  2.                 s.push( encodeURIComponent(this.name) + "=" + encodeURIComponent( this.value ) ); 
  3.             }); 

所以传给servlet的就是utf-8编码了,那么我们在过滤器中就必须使用utf-8进行转码。
对其中的过滤器做了下修正,在IE下和chrome下,request.getContentType()的值为"application/x-www-form-urlencoded",但是在firefox下,这个值为"application/x-www-form-urlencoded; charset=UTF-8",不是很明白ff为什么会是这个值。
filter代码如下:
Java代码 复制代码 收藏代码
  1. package com.ajax.demo.action; 
  2.  
  3. import java.io.IOException; 
  4.  
  5. import javax.servlet.Filter; 
  6. import javax.servlet.FilterChain; 
  7. import javax.servlet.FilterConfig; 
  8. import javax.servlet.ServletException; 
  9. import javax.servlet.ServletRequest; 
  10. import javax.servlet.ServletResponse; 
  11. import javax.servlet.http.HttpServletRequest; 
  12. import javax.servlet.http.HttpServletResponse; 
  13.  
  14. public class AjaxPostFilter implements Filter { 
  15.  
  16.     private static final String IE_CONTENT_TYPE = "application/x-www-form-urlencoded"
  17.     private static final String FF_AJAX_CONTENT_TYPE = "application/x-www-form-urlencoded; charset=UTF-8"
  18.     private static final String XMLHTTP_REQUEST = "XMLHttpRequest"
  19.     private static final String AJAX_CHARACTER_ENCODING_UTF8 = "UTF-8"
  20.  
  21.     public void destroy() { 
  22.         // TODO Auto-generated method stub 
  23.  
  24.     } 
  25.  
  26.     public void doFilter(ServletRequest servletRequest, 
  27.             ServletResponse servletResponse, FilterChain filterChain) 
  28.             throws IOException, ServletException { 
  29.         HttpServletRequest request = (HttpServletRequest) servletRequest; 
  30.         HttpServletResponse response = (HttpServletResponse) servletResponse; 
  31.         String requestedWith = request.getHeader("x-requested-with"); 
  32.         String type = request.getContentType(); 
  33.         if (XMLHTTP_REQUEST.equals(requestedWith)&& (FF_AJAX_CONTENT_TYPE.equals(type) 
  34.                 ||IE_CONTENT_TYPE.equals(type))) { 
  35.             request.setCharacterEncoding(AJAX_CHARACTER_ENCODING_UTF8); 
  36.             response.setCharacterEncoding(AJAX_CHARACTER_ENCODING_UTF8); 
  37. //          request.getParameterMap(); 
  38.         } 
  39.         filterChain.doFilter(request, response); 
  40.  
  41.     } 
  42.  
  43.     public void init(FilterConfig arg0) throws ServletException { 
  44.         // TODO Auto-generated method stub 
  45.  
  46.     } 
  47.  


web.xml配置,我用的是struts
Java代码 复制代码 收藏代码
  1. <filter> 
  2.         <filter-name>ajaxEncodeFilter</filter-name> 
  3.         <filter-class>com.ajax.demo.action.AjaxPostFilter</filter-class
  4.     </filter> 
  5.     <filter-mapping> 
  6.         <filter-name>ajaxEncodeFilter</filter-name> 
  7.         <url-pattern>*.do</url-pattern> 
  8.     </filter-mapping> 
  9.     <filter-mapping> 
  10.         <filter-name>ajaxEncodeFilter</filter-name> 
  11.         <url-pattern>*.jsp</url-pattern> 
  12.     </filter-mapping> 


这个filter应该在你的EncodeFilter之后,RoyMax说要在之前,我试了下是不行的。
经过这样设置之后,jsp使用gbk采用ajax提交就不会存在中文乱码了。

在使用chrome进行测试时,还发现chrome的一个奇怪问题,对于返回的结果,使用jquery.ajax处理
Java代码 复制代码 收藏代码
  1. success:function showResponse(responseText, statusText)  {  
  2. //这里name为input text id,如果"aa"在前,那么name的值会改为aa+返回的结果 
  3.                     $('#name').val("aa"+responseText); 
  4. //如果改成$('#name').val(responseText+"aa"),那么name的值仍然是//responseText,“aa”没有加到后面去,不知道是什么原因 



欢迎大家访问我的个人网站 萌萌的IT人

posted on 2013-03-29 08:16 一堣而安 阅读(250) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航:
博客园   IT新闻   Chat2DB   C++博客   博问  
 

导航

统计

常用链接

留言簿(1)

随笔分类

随笔档案

收藏夹

搜索

最新评论

阅读排行榜

评论排行榜