jquery form表单.serialize()序列化后中文乱码问题原因及解决

有时候我们需要使用ajax提交去提交form的值，这样就需要使用serialize()去获取form的值，但这样获取的值如果有中文，会乱码，原因和解决方法如下：

原因：.serialize()自动调用了encodeURIComponent方法将数据编码了 
解决方法：调用decodeURIComponent(XXX,true);将数据解码 

如：

vardata=$('#addf').serialize();
data= decodeURIComponent(data,true);

这是网上的第一种常规做法，但是试了下，并不好用。

 

使用$（form）.serialize()获得表单的所有信息：

我的设置:

1 工程编码,js,jsp,java设置为UTF-8

2 JSP页面编码:

　　<%@ page language="java" pageEncoding="UTF-8"contentType="text/html; charset=UTF-8"%> <metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"/>

 

3 JS中处理

encodeURI(encodeURI(data))  ///注意两次编码！！

4 Java类中处理

　　response.setCharacterEncoding("UTF-8");    //response.setContentType("text/html;charset=UTF-8"); //用于向页面输送中文字符串java.net.URLDecoder.decode((String)request.getParameter("username"),"UTF-8");

这是网上的第二种常规做法，也是一般的jsp基础编码设置。感觉主要是针对get方式提交表单，而我现在实在spring mvc中使用，要让提交的表单信息直接绑定要对象中。

但是缺出现了中文乱码的问题。

  源码：

   $.ajax({

                           url:$("#form").attr("action"),

                            data:$('#form').serialize(),// 要提交的表单

                            dataType:'json',

                            success: function(data) {

                                     if(data){

                                               artDialog.alert(data.message);

                             if(data.succeed == true){

                                      gotoView('<%=path%>/userManage/getlist.do');

                            } 

                                     }  

                            }

                        });

出现乱码的原因是：使用ajax请求，当没有设定请求type时，默认采用的是get请求方式。而get请求方式的乱码处理要采用

(String)request.getParameter("username"),"UTF-8");方式对每个中文进行单独的转码才能避免乱码的问题。

 

解决方法：

   当使用ajax序列化提交表单时，一定要使用post请求方式提交表单，避免乱码问题。

    $.ajax({

                            type: "POST",

                           url:$("#form").attr("action"),

                            data:$('#form').serialize(),// 要提交的表单

                            dataType:'json',

                            success: function(data) {

                                     if(data){

                                               artDialog.alert(data.message);

                             if(data.succeed == true){

                                      gotoView('<%=path%>/userManage/getlist.do');

                            } 

                                     }  

                            }

                        });