使用 Handsontable 时出现重复的标题

Posted 2023-03-22

【中文标题】使用 Handsontable 时出现重复的标题

【英文标题】：duplicate headers when using Handsontable

【发布时间】：2015-11-08 06:23:22

【问题描述】：

我正在使用 Handsontable，并且标题显示了两次。 是什么导致这种情况发生？

这是我的代码：

<script type="text/javascript">
        $(document).ready(function () 

          var data = [
              ['2009', 0, 2941, 4303, 354],
              ['2010', 3, 2905, 2867, 412],
              ['2011', 4, 2517, 4822, 552],
              ['2012', 2, 2422, 5399, 776]
            ],
            container = document.getElementById('example'), hot;

          hot = new Handsontable(container, 
            data: data,
            minSpareRows: 1,
            colHeaders: true,
            contextMenu: true,
            colHeaders: ['Cuenta Única', 'Número Comercio', 'Número PDV', 'Máximo Cuotas', 'Grupo Afinidad'],
            manualColumnResize: true,
            colWidths: [120, 120, 120, 120, 120, 120],
          );
        );
</script>

<div id="example"></div>

【问题讨论】：

能否请您在上面包含整个 html 或制作一个 jsfiddle？我可以让它在没有重复标题的情况下在这里工作：jsfiddle.net/ojdoowLw

谢谢。我从项目中制作了一个新的 html 文件并且运行良好。那么它一定是我用来干涉风格的框架中的一些东西。我正在使用一个非常古老的框架，称为“Mambo”，一定有问题。感谢您的帮助，我会继续努力。

至少我设法通过输入以下 css 样式来隐藏它： .ht_clone_top display: none!重要的;

【参考方案1】：

这是交易。您可能知道，Handsontable 允许您冻结列。为此，总是呈现两组表格。通过注意到第二个表称为ht_clone_top，您正确地找到了它。这个克隆可以让你冻结表，所以如果你删除它，即使你会修复你的错误，你也不能冻结行。

我可以告诉您我认为可能是您的问题，因为这是一个常见问题。您可能拥有修改表格元素的 CSS。不幸的是，您必须确保您还修改了克隆表。鉴于 CSS 的性质，这是一个非常难以解决的问题，但只要付出足够的努力，您就可以解决这个问题！

【参考方案2】：

您的代码中似乎有一个小错误。

将此行container = document.getElementById('example'), hot; 替换为以下代码 container = document.getElementById('example');

【讨论】：

谢谢您，我尝试了您的建议，但没有奏效。我会继续努力的。

【参考方案3】：

我已通过从 Hansontable 容器 DIV 元素中删除 padding 来解决此问题。