数据格式如图所示:

ajax请求双重遍历数据交互

代码:

$.ajax({
    type: "get",
    url: "./package.json",
    data: {
        'oaId': '46591',
    },
    dataType: "json",
    success: function(data){
     console.log(data);
        var tablebox = '', value_type = '';
    for(var j in data) {
        tablebox += '<div class="slide" id="box'+j+'">';
        tablebox +='<table><tr><th>日期</th><th>星期</th><th>日期类型</th><th>签入时间</th><th>签出时间</th><th>状态</th><th>打卡明细</th></tr>';
        for (var k in data[j]) {
            var value = data[j][k];
            if(value.type == 'WORK'){ value_type = '工作日';}else if(value.type == 'WEEKEND'){value_type = '周末';}else if(value.type == 'HOLIDAY'){
                value_type = '节假日';}
            tablebox += '<tr><td>'+ value.date + '</td><td>' + value.weekday + '</td><td>' + value_type + '</td><td>' + value.timeIn + '</td><td>' + value.timeOut + '</td><td>' + value.note + '</td><td><span title="'+value.details+'">' + value.details + '</span></td></tr>';
        }
        tablebox += '</table></div>';
    }
        $('#table01').append(tablebox);
        $('#table01 .slide:eq(0)').show();

    }
});

效果图:

ajax请求双重遍历数据交互

 

相关文章: