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("錯誤!!");
}
});


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。