gpt4 book ai didi

javascript - jQuery - 循环遍历 TD 宽度,然后循环遍历 TH 并应用 TD 宽度

转载 作者:太空宇宙 更新时间:2023-11-04 02:45:40 27 4
gpt4 key购买 nike

我有一个流动的 table ,现在需要一个固定的 thead。问题是当你固定 thead 时,th-s 不尊重 tbody 的 td-s 的宽度。列的大小都由 BootStrap 处理。我已经阅读了很多关于这个主题的文章,并看到了两种解决方案。为了争论的缘故,两者都不适合我。

  1. 锁定表格、th 和 tds 的宽度。所以没有响应宽度 - 因此水平滚动。

  2. 使用jquery 查找窗口宽度 并将高度 返回到表中。然后做一个带有锁定标题的内表滚动。 (找到的解决方案示例 http://www.bootply.com/JnOYtO9xzn# )

我想尝试的是在所有 td 上找到 width 并将这些 width 传递给相应的 th(如果我需要应用像 th1、td1 这样的类,那就这样吧)。本质上,我试图将 td 宽度绑定(bind)到 th。此外,在 window width 上更改更新。

表格示例:http://jsfiddle.net/u2xZU/165/https://jsfiddle.net/5hozvm5d/4/

最佳答案

这将确保 thead 中的 th 始终等于其列中 td 的宽度:

var timer;
$(window).resize(function() {
clearTimeout(timer);
timer= setTimeout(function() {
$('.table tbody tr:first td').each(function(idx) { //get the first row of tds
$('.table thead tr:first th').eq(idx)
.width($(this).width()); //set corresponding th width
});
},10);
}).resize();

使用 setTimeout() 可防止该函数在调整窗口大小时持续运行。

Fiddle

关于javascript - jQuery - 循环遍历 TD 宽度,然后循环遍历 TH 并应用 TD 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33881973/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com