ajax返回值的乱码现象产生的相关代码如下:
Java代码:
JsonObject jsonObject = new JsonObject();
jsonObject.addProperty("filterChannelData", filterChannelData);
IOUtils.write(jsonObject.toString().getBytes(), response.getOutputStream());
Javascript代码:
$.ajax({
type: "POST",
data:{
currentChannelValue: currentChannelValue
},
url: "/MyProject/setting",
dataType: "json",
success: function(data) {
$('#Switch_On_Channel').html(data.filterChannelData);
}
});
此时法文 één HD 是filterChannelData中内容,传到前台时,变成了乱码。
filterChannelData = "<option value=één HD>één HD</option>";
前端和后端的页面的默认编码格式都是utf-8。
经过调试发现,后台代码加上
response.setContentType("text/html;charset=utf-8");
依旧是乱码。然后通过用数组方式返回数据回去,乱码问题解决了。
Java代码:
ArrayList<String> filterChannelsList = new ArrayList<String>();
……
response.setContentType("text/html;charset=utf-8");
try(PrintWriter pw = response.getWriter()){
pw.write(String.join(",",filterChannelsList));
}catch (Exception e) {
LOG.error(e.getMessage(), e);
}
JavaScript代码:
$.ajax({
type: "POST",
data:{
currentChannelValue: currentChannelValue
},
url: "/MyProject/setting",
success: function(data) {
var arr = data.split(",");
var channelFilterData="";
for (var i = 0; i < arr.length; i++) {
channelFilterData += "" + "<option value=\""+ arr[i] + "\">" + arr[i]+ "</option>";
}
$('#Switch_On_Channel').html(channelFilterData);
}
});
总结:由于ajax 返回的编码方式是json,导致的法文乱码,若返回的编码方式是text,html,依旧是乱码的。最后用数组的方式从后台传数据上来,就不会出现乱码了。