使用Javascript排除第一個和最後一個的HTML表格中的行和列總和

Question

我想從一個Javascript二維數組創建一個HTML表，並且我試圖在表中排除每行和列的總和每行中的第一行和第一個TD。

var pandlarray = [ 
[2017-04,0,-118.05,-181.21,-400.43,0] 
[2017-05,1510.27,-35.34,-180.99,-351.46,0] 
]; 
// BEGIN - Create HTML table from javascript array. 
function makeTableHTML(myArray) { 
    var result = "<table id='pandltable'>"; 
    result += "<tr><td>Month</td><td>Revenue</td><td>MaterialCost</td><td>Utilities</td><td>Labor</td><td>Margin</td></tr>"; 
    for(var a=0; a<myArray.length; a++) { 
     result += "<tr>"; 
     for(var j=0; j<myArray[a].length; j++){ 
     if (myArray[a][j] === 0) { 
      result += "<td>"+0+"</td>"; 
     } 
     else { 
      result += "<td>"+myArray[a][j]+"</td>"; 
     } 
     } 
     result += "</tr>"; 
    } 
    result += "<tr><td><strong>Total<strong></td><td></td><td></td><td></td><td></td><td></td></tr></table>"; 
    return result; 
    } 
    document.write(makeTableHTML(pandlarray)); 
    // END - Create HTML table from javascript array. 
    // BEGIN - Total row and columns for pandltable. 
    $("#pandltable tr:not(:first,:last) td:last-child").text(function(){ 
    var t = 0; 
    $(this).prevAll().each(function(){ 
     t += t += parseFloat($(this).text(),0) || 0; 
    }); 
    return t; 
    }); 

    $("#pandltable tr:last td:not(:first)").text(function(i){ 
    var t = 0; 
    $(this).parent().prevAll().find("td:nth-child("+(i + 2)+")").each(function(){ 
     t += parseFloat($(this).text(),0) || 0; 
    }); 
    return t; 
    }); 
    // END - Total row and columns for pandltable. 

不是我認識的最漂亮的代碼，但這是我必須使用的。現在正在返回到每行和每列的總數的值不在正確的位置，它們也顯示重複的小數位數。請幫忙。

Answer 1

對您的數組定義進行了一些更改並創建表函數。將'class'分配給月份列以防止它被添加到每一行中。並使用.toFixed（）函數將總數限制爲兩個小數點。第一個函數有錯誤 - 計算每行的總數 - t + = t + = - 這可能是錯字。

var pandlarray = ["2017-04,0,-118.05,-181.21,-400.43,0", 
    "2017-05,1510.27,-35.34,-180.99,-351.46,0" 
    ]; 
    // BEGIN - Create HTML table from javascript array. 
    function makeTableHTML(myArray) { 
     var result = "<table id='pandltable'>"; 
     result += "<tr><td width='20%'>Month</td><td width='20%'>Revenue</td><td width='20%'>MaterialCost</td><td width='20%'>Utilities</td><td width='20%'>Labor</td><td width='20%'>Margin</td></tr>"; 
     for(var a=0; a<myArray.length; a++) { 
     var thisRow = myArray[a].split(","); 

      result += "<tr>"; 
      for(var j=0; j<thisRow.length; j++){ 
      if (j === 0) { 
       result += "<td class='first'>"+thisRow[j]+"</td>"; 
      } 
      else { 
       result += "<td>"+thisRow[j]+"</td>"; 
      } 
      } 
      result += "</tr>"; 
     } 
     result +="<tr><td colspan=6>&nbsp;</td> </tr>"; 
     result += "<tr><td><strong>Total<strong></td><td></td><td></td><td></td><td></td><td></td></tr></table>"; 
     return result; 
     } 

     document.write(makeTableHTML(pandlarray)); 
     // END - Create HTML table from javascript array. 
     // BEGIN - Total row and columns for pandltable. 
     $("#pandltable tr:not(:first,:last) td:last-child").text(function(){ 
     var t = 0; 
     $(this).prevUntil(".first").each(function(){ 
      t += parseFloat($(this).text(),2) || 0; 
     }); 
     t = t.toFixed(2); 
     return t; 
     }); 

     $("#pandltable tr:last td:not(:first)").text(function(i){ 
     var t = 0; 
     $(this).parent().prevAll().find("td:nth-child("+(i + 2)+")").each(function(){ 
      t += parseFloat($(this).text(),0) || 0; 
     }); 
     t = t.toFixed(2); 
     return t; 
     }); 
     // END - Total row and columns for pandltable.