1. 程式人生 > >list集合轉換成json資料,ajax請求返回json資料,再通過迴圈顯示出來

list集合轉換成json資料,ajax請求返回json資料,再通過迴圈顯示出來

之前在網上查了很多關於迴圈顯示ajax返回值的方法,很多都不對的,顯示不了我要的結果。後來自己鼓搗出來了,發出來分享一下自己的成果。因為ajax不能返回集合的,需要把集合list轉換成json返回,再用迴圈的方式,顯示出結果。

操作層

//編碼方式
request.setCharacterEncoding("utf-8");
//建立String物件,接受傳遞過來的值
String str=request.getParameter("fenlei");
System.out.println(str);
//建立Hero的物件,為了呼叫Hero的方法
Hero hero=new Hero();
//hero呼叫HeroFenLei(),加上引數str,把獲得的值,賦給集合
List<HeroMessage> list=hero.HeroFenLei(str);
JSONArray listArray=JSONArray.fromObject(list);

response.setCharacterEncoding("utf-8");

response.getWriter().write(listArray.toString());

jsp頁面

$(function(){
$("#zhanshi input").click(function(){
alert("sda");
$("#ziliaoku_hero table").css("display","none");
$.ajax({
//傳輸方式
type:"post",
url:"herofenlei",
data:{"fenlei":$("#zhanshi input").val()},
dataTpye:"json",
success:function(data){
var json=eval(data);
var con;
$.each(json,function(index,item){
var s1=json[index].heroHear;
var s2=json[index].herowaihao;
con+="<td ><img src='"+s1+"'  width='64px' height='64px'  /><p style='font-size: 15px;'>"+s2+"</p></td>"; 
});
console.log(con);
$("#zhanshi11").html(con);
}
}); 
});
});