ajax对list中的list进行循环

后台返回的数据结构:
---------------------

ajax解释方法:
------------------------
$(function () {
$('#check').click(function () {
$.ajax({
url:"/sc/find",
type:"post",
data:{},
success:function (data) {
//循环list中的list
var Temp = ''//先定义一个变量为空
$.each(data, function (i, item) {//对第一层list进行循环
Temp += "<h4> " + item.scClass + " " + item.scBzr + "</h4>\n" +//拿到第一层循环的对象值,循环放入Temp变量中,下面直到循环结束前都是固定内容
" <ol>\n" +
" <table class=\"table table-bordered\">\n" +
" <thead>\n" +
" <tr>\n" +
" <th>姓名</th>\n" +
" <th>学号</th>\n" +
" <th>性别</th>\n" +
" <th>年龄</th>\n" +
" </tr>\n" +
" </thead>\n" +
" <tbody>\n"

$.each(item.userList, function (i, item) {//进行list中包含的list循环

Temp += " <tr>\n" +//拿到第二层循环对象的值以及固定html代码循环放入Temp变量中
" <td>" + item.stuName + "</td>\n" +//拿到list中的list的对象值,进行赋值
" <td>\" + item.num + \"</td>\n" +
" <td>\" + item.sex + \"</td>\n" +
" <td>\" + item.age + \"</td>\n" +
" </tr>\n"
})

Temp += " </tbody>\n" +
" </table>\n" +
" </ol>"
});

$("#search").append(Temp)//在id为search的后面加入上面设置好的代码

console.log(data);
},
error:function (e) {
alert("错误!!");
}
});
posted @ 2018-08-30 16:34  火源  阅读(2488)  评论(0编辑  收藏  举报