Ajax中文乱码问题解决方案一: 1.向服务器发送数据: 客户端: var date = document.getElementById("username"); var url = "AjaxServlet?username=" + encodeURI(encodeURI(date.value)); 向服务器端发请的数据进行两次encodeURI: Java 中的 request.getParameter(String)方法会进行一次 URI 的解码过程, 调用时内置的解码过程会导致乱码出现。而 URI 编码两次后,request.getParameter(String) 函数得到的是原信息 URI 编码一次的内容。 接着用 java.net.URLDecoder.decode(String str,String codename) 方法, 将已经编码的 URI 转换成原文。 服务器端: String username = URLDecoder.decode(request.getParameter("username"),"UTF-8"); System.out.println(username); 2.接收服务器端数据: 原因:AJAX在接收responseText或responseXML的值的时候是按照UTF-8的格式来解码的, 如果服务器段发送的数据不是UTF-8的格式,那么接收responseText或responseXML的值有可能为乱码。 解决办法: 在服务器指定发送数据的格式: response.setContentType("text/xml;charset=UTF-8"); response.setHeader("Cache-Control", "no-cache"); String message = "你输入的用户名是:" + username; PrintWriter out = response.getWriter(); out.println("<response>"); out.println("<passed>" + Boolean.toString(false) + "</passed>"); out.println("<message>" + message + "</message>"); out.println("</response>"); out.close(); //客户端接收解析数据: var mes =xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data; var val =xmlHttp.responseXML.getElementsByTagName("passed")[0].firstChild.data;
/** * Ajax中文乱码问题 * * @author zhangmingxue * */ public class AjaxServlet extends HttpServlet { /** * */ private static final long serialVersionUID = 6930790433539669771L; public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { this.doPost(request, response); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String username = URLDecoder.decode(request.getParameter("username"),"UTF-8"); System.out.println(username); response.setContentType("text/xml;charset=UTF-8"); response.setHeader("Cache-Control", "no-cache"); String message = "你输入的用户名是:" + username; PrintWriter out = response.getWriter(); out.println("<response>"); out.println("<passed>" + Boolean.toString(false) + "</passed>"); out.println("<message>" + message + "</message>"); out.println("</response>"); out.close(); } }
<html> <head> <title>AjaxEncoding</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <script language="javascript"> var xmlHttp; function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } function validate() { createXMLHttpRequest(); var date = document.getElementById("username"); var url = "AjaxServlet?username=" + encodeURI(encodeURI(date.value)); xmlHttp.open("GET", url, true); xmlHttp.onreadystatechange = callback; xmlHttp.send(null); } function callback() { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { var mes =xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data; var val =xmlHttp.responseXML.getElementsByTagName("passed")[0].firstChild.data; setMessage(mes, val); } } } function setMessage(message, isValid) { var messageArea = document.getElementById("dateMessage"); var fontColor = "red"; if (isValid == "true") { fontColor = "green"; } messageArea.innerHTML = "<font color=" + fontColor + ">"+ message + " </font>"; } </script> <body> <input type="text" size="10" id="username" onchange="validate();" /> <div id="dateMessage"></div> </body> </html>