拆分“大”表格到较小的表格 [英] Split a "big" table to smaller tables

问题描述

我想将一个大表（很多列）分割成更小的表，例如2列。

I would like to split a "big" table (a lot of columns) to smaller tables every for example 2 columns.

有没有简单的方法可以做到那？

Is there an easy way to do that?

我只有这里的表 http：// jsfiddle达网络/ xy3UF / 4 / 。我想例如每2列分割一次。因此，我应该有一个包含＃列的三个表格，每个表格包含大表格中的两列。

I only have the table here http://jsfiddle.net/xy3UF/4/. And I would like for example split it every 2 columns. As a result I should have a three tables with containing the # column and each one containing 2 of the columns from the big table.

期望的输出： http://jsfiddle.net/xy3UF/15/ p>

Desired output: http://jsfiddle.net/xy3UF/15/

推荐答案

function split($table, chunkSize) {
  var cols = $("th", $table).length - 1;
  var n = cols / chunkSize;

  for (var i = 1; i <= n; i++) {
     $("<br/>").appendTo("body");
     var $newTable = $table.clone().appendTo("body");
     for (var j = cols + 1; j > 1; j--) {
         if (j + chunkSize - 1 <= chunkSize * i || j > chunkSize * i + 1) {
             $('td:nth-child(' + j + '),th:nth-child(' + j + ')', $newTable).remove();
         }
     }
  }  
}

哪里 $ table 是表jQuery对象， chunkSize 是每个 split 的大小。在你的例子中，把它称为 split（$（table），2）。请注意， chunkSize 必须平均分配列数（不包括第一个列）以使其正确工作，例如，对于具有7列的表，有效 chunkSize 的值为1,2和3。

Where $table is the table jQuery object, and chunkSize is the size of each split. In your example, call it as split($("table"), 2). Note that chunkSize must evenly divide the number of columns (excluding the first one) for this to work correctly, for example, for a table with 7 columns, the valid values for chunkSize are 1, 2, and 3.

DEMO 。

DEMO.

这篇关于拆分“大”表格到较小的表格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！