1. 程式人生 > 其它 >js繫結table資料,合併列

js繫結table資料,合併列

技術標籤:jsjs資料結構

要求效果在這裡插入圖片描述
一開始一直沒想到咋寫,因為資料格式項名稱是一個數組,腦袋轉不過來,不知道迴圈第二個陣列時如何還讓第一個迴圈正常走;
解決:

let totalIndex = 1;
var htmlList="";
 for (var i = 0; i < listOld.length; i++) {
        var item = listOld[i];
        for (var j = 0; j < item.DeductPointList.length; j++) {
            if (j == 0) {
htmlList += '<tr>'; htmlList += '<td>' + totalIndex + '</td>'; htmlList += '<td rowspan="' + item.DeductPointList.length + '">' + item.DeductItemName + '</td>';//這裡重點 htmlList += '<td>' + item.
DeductPointList[j].DeductPoint + '</td>'; htmlList += '<td class="score_td">-' + item.DeductPointList[j].Score + '</td>'; htmlList += '<td><span class="cz_bj" οnclick="addNew(' + item.DeductItem_Code + ')">編輯</span><span class="cz_sc" οnclick="deteleFun('
+ item.DeductItem_Code + ',' + item.DeductPointList[j].DeductPointCode+')">刪除</span></td>'; htmlList += '</tr>'; } else { htmlList += '<tr>'; htmlList += '<td>' + totalIndex + '</td>'; htmlList += '<td>' + item.DeductPointList[j].DeductPoint + '</td>'; htmlList += '<td class="score_td">-' + item.DeductPointList[j].Score + '</td>'; htmlList += '<td><span class="cz_bj" οnclick="addNew(' + item.DeductItem_Code + ')">編輯</span><span class="cz_sc" οnclick="deteleFun(' + item.DeductItem_Code + ',' + item.DeductPointList[j].DeductPointCode +')">刪除</span></td>'; htmlList += '</tr>'; } totalIndex++; } } $('#contentBox tbody').html(htmlList)