What should I do if the ajax return value of jquery is Chinese garbled code?

The solution to the problem that the ajax return value of jquery is Chinese garbled code: 1. [PrintWriter out = response.getWriter()] is placed after the relevant correct code; 2. jquery adds the parameter [content-type].

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, DELL G3 computer.

Recommended: jquery video tutorial

The solution to the problem that jquery’s ajax return value is Chinese garbled code:

Using jquery's ajax, I encountered a problem. The data obtained by the server from the database did not have Chinese garbled characters (the logs were typed out without garbled characters), but when it was asynchronously transmitted to the client, Garbled characters appear. The server side has been encoded (UTF-8 encoding). At first, I always suspected that it was a client-side problem. For example, the client-side and server-side encodings were inconsistent. I also suspected that the AJAX tool function of JQuery was missing contentType: "application/x-www-form-urlencoded; charset=utf -8", etc.

The result was neither, I struggled for several hours, and later found out that the original code was still on the server side, and it was an oversight.

Server-side code:

/**
* 异步（返回json数据格式）（支持分页）
* @param mapping
* @param form
* @param request
* @param response
* @return
* @throws AppException
*/
public ActionForward queryErrorCodeRecordByPage(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
Integer currentpage = Integer.parseInt(request.getParameter("currentpage")) ;
Integer pagesize = Integer.parseInt(request.getParameter("pagesize")) ;
try 
{
List ListByPage = this.errorCodeRecordFacade.queryErrorCodeRecordByPage(currentpage, pagesize);
JSONArray json = JSONArray.fromObject(ListByPage);
System.out.println("JSONArray数据---" + json.toString() );
request.setCharacterEncoding("utf-8");  //这里不设置编码会有乱码
        response.setContentType("text/html;charset=utf-8");
        response.setHeader("Cache-Control", "no-cache");  
PrintWriter out = response.getWriter();  //输出中文，这一句一定要放到response.setContentType("text/html;charset=utf-8"),  response.setHeader("Cache-Control", "no-cache")后面，否则中文返回到页面是乱码  
out.print(json.toString());
out.flush();
out.close();
} 
catch (Exception e) {
log.error("查询数据出错", e);
}
return null ;
}

Client-side code:

//异步 根据分页来取错误码历史 数据
function search_errorCodeRecord(currentpage,pagesize)
  {
       $.ajax({
          async :true,
  url: "<%=request.getContextPath()%>/errorCodeRecord/queryErrorCodeRecordByPage.do",
  type: "post",
  data: { currentpage: currentpage, pagesize:pagesize},  
//  dataType : "json", //这里已经定义数据格式
      contentType: "application/x-www-form-urlencoded; charset=utf-8", 
  success:function(data) {
          alert(data);
  //  var json=eval(&#39;(&#39;+data+&#39;)&#39;);   // jquery调用时会检测到，从而直接把返回格式当做json处理，所以再转化会报错。
    var json=eval(data);
   resolv_json(json) ;
   }
});
     }
 
 
 //解析json数组，动态拼接到白色Div中
 function resolv_json(json)
 {
    for(var i=0;i<json.length;i++)
    {
      //  alert(json[i].boss_resultinfo);
      
      var operate_state = "新增了" ;
      if(json[i].operate_state  == "2" )
      {
operate_state= "修改了"  ;
      }
      if(json[i].operate_state  == "3" )
      {
operate_state= "删除了"  ;
      }
      var p=$("<p></p>");
      var span1=$("<span></span>");
      var span2=$("<span></span>");
      var span3=$("<span></span>");
      var span4=$("<span></span>");
      
      var times = json[i].operate_time.time;
    //  alert(json[i].operate_time.time); //时间格式是个JSON对象
//  alert(getLocalTime(times));
      span1.html(getLocalTime(times));
      span2.html(json[i].operate_people);
      span3.html(operate_state);
      span4.html(json[i].businessname +" 错误码");
      
      p.append(span1).append(span2).append(span3).append(span4);
      $("#whiteDiv").append(p);
    }
 
 }
 
//时间戳转化为时间
function getLocalTime(nS) {
    return new Date(parseInt(nS)).toLocaleString().replace(/:\d{1,2}$/,&#39; &#39;);
}
 
 
<div  id="whiteDiv">
 
</div>

The summary is as follows:

1. PrintWriter out = response.getWriter(); Must be placed after the

request.setCharacterEncoding("utf-8");  response.setContentType("text/html;charset=utf-8");

encoding (the reason is very simple, you know.)

2. Whether jquery adds the content-type parameter will not affect it.

contentType: "application/x-www-form-urlencoded; charset=utf-8",

Related free learning recommendations: javascript(Video)

The above is the detailed content of What should I do if the ajax return value of jquery is Chinese garbled code?. For more information, please follow other related articles on the PHP Chinese website!