jQuery - 将表分成不同长度的部分

Question

我有一张大桌子，下面是它的一部分：

我的目标是通过切换除Sum行之外的所有部分行并将部分标题移动到空的sum行单元格，然后在下一次切换时将其移回原始形式，使每个部分可折叠和不可折叠。 / p>

我试图从几个角度来解决这个问题，但由于我是一个jQuery新手，我不能为我的生活找到一种有效的方法。

问题的第一部分实际上是定义部分。因为它们的长度不同，我想我首先需要遍历每一行并检查第一个单元格是否为空。如果不是，我认为它是一个新的部分，如果是，我认为它是另一个并将其添加到当前部分。

然后，对于每个部分的第一行和单元格，我设置了一个on click事件，该事件切换除Sum行之外的所有行，并将部分标题移动到其中。

我已经设法完成了这个，但是它使用了大量不合理的Javascript并且非常慢。就像我说的那样，我想知道如何以最有效的方式做到这一点。

从本质上讲，有一种很好的方法可以使用jQuery选择器选择所有部分，而不必遍历每一行并检查每个单元格等吗？我很高兴知道是否有更有效的方法来做到这一点，但我们非常感谢解决方案。

为了好奇，这里是我用来为图像着色的代码：

var rowCount = $("tr").length;

var rows = $("tr > td:first-child").not("tr:nth-child(1) > td:first-child").not("tr:nth-child("+rowCount+") > td:first-child").not("tr:nth-child("+(rowCount-1)+") > td:first-child");

var sectionTitles = $(rows).filter(function(){
    return !($(this).text()=="");
});

var sectionItemTitles = $(rows).not(sectionTitles);

sectionTitles.css({"background":"red"});
sectionTitles.attr("type","section");

sectionItemTitles.css({"background":"blue"});
sectionItemTitles.attr("type","row");

Answer 1

要实现此功能，您必须识别需要分组的行以及添加类和plusminus的图像以指示可折叠空间。在plusminus的click函数上，使用toggle（）函数折叠或取消折叠分组数据。

toggle jquery