问题标签 [fixed-header-tables]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
6235 浏览

angular - Angular Material 固定表头

这似乎是一个已知问题,但似乎还没有解决方案。在安装 Angular 固定表头以保持列标题可见之后。当我将 fix-head 属性添加到控制台时,<thead>此错误出现在控制台中:

找不到指令“mdcolumn”所需的控制器“mdtable”

从我的研究来看,它似乎与 ui-router 或 ng-if 有关。就我而言,当浏览器重新加载时,它适用于我的第一页,但在我的其他页面上,我在控制台中遇到了这个问题。这是我用来安装固定标头的站点:https ://github.com/daniel-nagy/fixed-table-header

0 投票
1 回答
717 浏览

datatables - dataTable - 需要修复标题行

数据表头随表移动。我尝试在我的代码中添加类似问题必须提供的内容等等。似乎没有任何效果。有人可以查看我的代码并就如何修复标题行提供建议吗?代码:

0 投票
1 回答
1375 浏览

c# - asp.net 中继器垂直和水平滚动条和固定标题

在浏览器上启用滚动条似乎有很多混乱和不必要的复杂性。

我有一个 asp.net 应用程序,我正在尝试显示一个使用 asp.net 中继器制作的队列。垂直滚动条按预期工作没有问题。但是,在窗口底部(不在 div 或应用程序中的任何其他元素上,在浏览器窗口上)有一个默认的水平滚动条已被证明是一个巨大的痛苦,我找不到任何解决方案.

如何确保在浏览器上启用了水平滚动条?

另外,作为一个额外的问题,如何将中继器表的标题固定在屏幕上?代码如下。

0 投票
1 回答
768 浏览

jquery - 两个单独的固定列标题,带有 CSS 或 JQuery 的水平滚动

我试图在同一页面上获得两个单独的表格,以具有固定的标题,这些标题要么具有垂直滚动内容,要么在向下滚动时“粘”在页面顶部。

我遇到的问题是其中一张表具有水平滚动内容。

这是它的样子。我想修复的是左侧的“JAPAN”、“Customer”列,然后是水平滚动表中的“Producer”、“PR”和“Q”列。这是否可以通过 CSS 甚至 JQuery 以及我的设置方式实现?

谢谢。

JSFiddle: https ://jsfiddle.net/7fnzxoq4/

来自 JSFiddle 的示例代码:

HTML

CSS

0 投票
1 回答
426 浏览

datatables - VueJS DataTables fixedHeader 不起作用

任何人请建议我如何使用 dataTables 使 fixedHeader 属性在 vue.js 中工作

0 投票
0 回答
959 浏览

angular - 在 Angular 4 中使用固定标题调整可滚动表的大小

我编写了一个调整大小服务,它对所有调整大小事件都非常有用。我能够调整 div 的大小等等,但我正在为我的“固定大小”表而苦苦挣扎。我可以让它成为可滚动表格的唯一方法是在 CSS 中对高度进行硬编码。我正在尝试使表格随屏幕调整大小。我究竟做错了什么?请原谅我下面糟糕的编码实践。

表代码:

CSS:

角度:

0 投票
2 回答
1799 浏览

html-table - 向具有固定标题和左列的表添加工具提示

我正在尝试将工具提示添加到具有固定标题和左列的可滚动表中。当我添加工具提示时,当滚动表格时,单元格不再隐藏在固定的标题和列后面。

这里有一个小提琴显示问题:

https://jsfiddle.net/6jh60sgs/9/

我需要做什么才能使带有工具提示的单元格滚动到固定的标题和列后面?

0 投票
5 回答
79509 浏览

html - 具有固定和可滚动的

我已经浏览了这里的问题和互联网上的文章,但还没有找到满足我要求的解决方案。所以现在在 2017 年,是否有一种优雅的方式可以实现<table>

  1. 用html+css写(无js)
  2. 有固定的标题(不可滚动;不粘)
  3. 具有可滚动性<tbody>(滚动条可能始终可见)
  4. header 和 body 将正确处理调整大小,而不是弄乱<thead>列和<tbody>列的对齐方式
  5. 不会使用嵌套表或单独的表作为标题

需要帮助比较用于彩票模拟的数组

我可能在这里的某个地方搞砸了,但这是我到目前为止所拥有的。那么如何将 6 个随机生成的彩票中奖号码与用户输入的 6 个号码进行比较。说明说要“显示中奖号码、玩家号码以及匹配的号码。例如,如果您的中奖号码是 3,5,9,1,4,7,而您的玩家号码是 2,5,7,1 , 9,8,那么你有两个匹配项(5 和 1)。5 在第二个位置,1 在两个数组的第四个位置。此外,我尝试使用 randomInts 生成 6 个随机中奖号码,但不确定是否应该使用“i < list.Length”或其他内容。任何帮助表示赞赏。

0 投票
2 回答
1506 浏览

html - 表格布局:固定百分比和计算不起作用

我有一个有很多行的表格,我想在滚动时覆盖一个固定的表格标题。页面的布局是响应式的,带有一个固定的左侧菜单,可以有 2 个固定宽度中的 1 个。我在将固定标题中的列与表格对齐时遇到问题。

按照这个小提琴

我找不到正确计算第一列和最后两列百分比的方法。我努力了:

  • 宽度:计算(20% - 20px);
  • 宽度:20%;
  • 宽度:计算(100%-100px)/5;(这对我来说似乎是正确的,并且在片段中)

不幸的是我也不能移动位置:相对于顶部

0 投票
1 回答
876 浏览

html - 具有可变列宽和固定页眉和页脚的可滚动表格

又是那个问题……

在 CSS 中,只有整个表格可以滚动,没有简单的方法来固定页眉或页脚。

这里的大多数答案都依赖于 Javascript,这使得调整大小变得难以忍受,或者依赖于固定的列宽,这破坏了 a<table>或固定表的点。

这是一个不会与表格属性混淆的纯 CSS 解决方案: https ://codepen.io/Lasheimok/pen/jZqRvp

它使用 Firefox 的-moz-element属性来镜像表外空 div 的页眉和页脚。所以表格的所有样式仍然有效 - 将宽度拉伸到内容,在标题中对齐,在等待 Javascript 重绘表格时没有延迟......

但是仍然存在一些问题:

  • 最明显的一个:只有 Firefox
  • 左右滚动时,表格滚动,但页眉和页脚不滚动
  • 表格底部有一个空白区域,页脚被隐藏

我对 Chrome 版本的研究不多,但它确实具有可以替代使用的类似属性。

大多数情况下我需要最后两点的帮助:如何让页眉与表格的其余部分一起水平滚动,以及如何删除表格底部隐藏页脚的空白空间?