无法在嵌套在选项卡中的表格上使用jQuery floatThead。

Question

我放弃了尝试在可滚动表格上正确运行固定标题的之前尝试过的努力，而是使用了这个插件：http://mkoryak.github.io/floatThead/

在我的工作中，我们的网页界面以两种方式显示特定视图的表格 -- 使用选项卡或直接显示表格。

以下是带有选项卡的结构：

<div class="tab-content">
    <div class="tab-pane  active" id="tab1">
    ... a couple stuff
    <table  id='resizable118' cellpadding='5' cellspacing='0' border='0' Width='75%' leftmargin='50' >
        ... stuff in the table every row has font size of 3 but that's it
    </table>
    </div>
</div>

这是没有标签的结构：

<table  id='resizable118' cellpadding='5' cellspacing='0' border='0' Width='75%' leftmargin='50' >
     ... stuff in the table every row has font size of 3 but that's it
</table>

正如您所看到的，这两种情况下表格的生成方式是完全一样的。唯一的区别是用于选项卡视图的两个

元素包围表格。

该插件指示将表格包装在类似

元素的东西中。当我在不使用选项卡时用

元素包装表格，然后激活插件，一切都很好。

问题：无论我是否使用新的

元素包装表格或使用现有的一个

元素来使用选项卡视图，表格都会破裂。

表头和正文被水平挤压，之后没有任何列能够对齐。当我停用插件时，一切都恢复正常。

有人以前使用过jQuery floatThead遇到过这种情况吗？我该怎么解决选项卡表格视图的问题？

- Joe

---

我是插件的作者。如果您可以向我展示一个能够重现此问题的jsfiddle，我可以帮助您。从问题中很难准确地判断发生了什么。 - mkoryak

一切都好 - 几周前我设法修复了它。 - Joe

@mkoryak，你在这里，有没有办法让它也适用于tfoot？ - Flavien Volken

无法使用该插件浮动tfoot。请参见：https://github.com/mkoryak/floatThead/issues/27 - mkoryak

Answer 1

从文档（http://mkoryak.github.io/floatThead/）中可以看到有一个“reflow”方法，

因此，在包含该表格的选项卡上添加onclick事件，

onclick="$table.floatThead('reflow');"

我用这种方式制作的可以正常工作 :)

- Amos

---

$('#data-table').floatThead('reflow') 这个还是不起作用。如果你确信知道答案，能否请你提供完整的解决方案？ - Sujoy