动态调整HTML表格

我有两个需要合并在一起的HTML表格，然后将结果作为单独的表格输出。动态调整HTML表格

功能objectify()找到的每个预合并表格，并把他们的数据为对象的格式如下：

正是从这时开始的事情变得棘手。我的standardise()函数循环遍历每个对象，将标题和日期值放入数组中，然后调用removeDuplicates()删除重复项（不言自明）。

但是，当谈到将每个对象合并在一起并将数据输出到表中时，我想不出如何去做。到目前为止，我只能计算如何输出表头，如下所示：

Here是链接到我的codepen。任何帮助，将不胜感激。

来源

2015-12-10 Mike Resoli

是否可以给出结果表的例子？ –

为什么你不把比较数据作为第一个普通TD中的字符串，而不是你填写其余的？使用**每个**循环第一个常见的TD和**：包含**在另一个表中找到具有相同数据的td，而不是**最接近（'tr'）**您应该可以执行诀窍。 – Vixed

@Vixed是否可以为你写一个小例子？感谢您的回答。 –

我删除了一下你的代码的，现在似乎工作。 http://jsfiddle.net/dt1dmmk2/

function removeDuplicates(array) { 
    var cleanValues = []; 
    $.each(array, function(i, el) { 
    if ($.inArray(el, cleanValues) === -1) cleanValues.push(el); 
    }); 
    return cleanValues; 
} 
var titles=[]; 
var totRow=0 
    $('.before table').each(function() { 
    var rowNumber=$('tr',this).length-1; 
    if (totRow<rowNumber) 
     totRow=rowNumber; 

    var firstCol; 
    var secondCol; 
    $('tr',this).each(function(index) { 
     if (index == 0) { 
     firstCol=$('td:first',this).text(); 
     secondCol=$('td:last',this).text(); 
     titles.push(firstCol,secondCol) 
     } else { 
     $('td:first',this).attr('data-col',firstCol); 
     $('td:last',this).attr('data-col',secondCol); 
     } 
    }); 
    }) 
    titles=removeDuplicates(titles); 
    $('.after table').append('<tr>'); 
    for (i in titles) { 
    $('.after table tr:last').append('<th>' + titles[i] + '</th>'); 
    } 
    for (var b=0;b<totRow;b++) { 
     $('.after table').append('<tr />') 
     for (i in titles) { 
      var textToFill=$('.before td[data-col="'+titles[i]+'"]:first').text(); 
      $('.after table tr:last').append('<td>'+textToFill+ '</td>'); 
      $('.before td[data-col="'+titles[i]+'"]:first').removeAttr('data-col') 
     } 
    } 
    $('td[data-col]').removeAttr('data-col'); // just to clean

当然的TR已经在。前表订购并以这种方式你就不需要重新安排新的。

来源

2015-12-10 14:34:58 Vixed

希望这fiddle将帮助你了解是否缺少;）

/* please check this loop. Here you have to put your cleanYCol as well */ 
    for (i in cleanXCol) { 
    $(resultsTableBody).append("<tr />") 
    $('tr:last',resultsTableBody).append("<td>" + cleanXCol[i] + "</td>"); 
    // $('tr:last',resultsTableBody).append("<td>" + cleanYCol[i] + "</td>"); 
    }

http://jsfiddle.net/6q9dqozp

来源

2015-12-10 12:03:27 Vixed

感谢您的支持，我现在正在成功打印来自第一个表格中正确列的数据。但是，由于每个表的预合并表行数为7，因此“cleanYCol”数组的长度将为14.由于我从表中收集了所有日期并删除了重复项（导致了“cleanXCol”），这意味着只有7个。我如何编写一个语句来打印'cleanYCol'的另一半？ –

动态调整HTML表格

回答

相关问题