Javascript 如何在IE11中为HTML表实现粘性头?

Javascript 如何在IE11中为HTML表实现粘性头?,javascript,html,jquery,css,bootstrap-4,Javascript,Html,Jquery,Css,Bootstrap 4,我正在为一个仍在使用InternetExplorer11的客户机使用HTML、Bootstrap、CSS和JS(以及jQuery)构建一个表。我找不到一种方法,使其标题粘在IE中 我目前正在使用位置:sticky,它在所有三种主要浏览器(Edge、Chrome和Firefox)中都能正常工作。我知道IE不支持它。下面是我桌子的图片。它使用行span在标题中包含标题。 我尝试过不同的填充物和解决方案,但它们要么破坏了某些东西,要么就是不起作用 这是我在表格中使用的HTML和CSS tr>th{

我正在为一个仍在使用InternetExplorer11的客户机使用HTML、Bootstrap、CSS和JS(以及jQuery)构建一个表。我找不到一种方法,使其标题粘在IE中

我目前正在使用
位置:sticky
,它在所有三种主要浏览器(Edge、Chrome和Firefox)中都能正常工作。我知道IE不支持它。下面是我桌子的图片。它使用
行span
在标题中包含标题。 我尝试过不同的填充物和解决方案,但它们要么破坏了某些东西,要么就是不起作用

这是我在表格中使用的HTML和CSS

tr>th{
文本对齐:居中;
字号:600;
字体系列:Arial、Helvetica、无衬线字体;
字体大小:12px;
}
.tr1>th{
位置:粘性;
排名:0;
盒影:1px 0px 0px 0px 212529;
}
.tr2>th{
位置:粘性;
顶部:93px;
盒影:1px 0px 0px 0px 212529;
}
泰德{
位置:粘性;
排名:0;
}
tr>td{
字体系列:Arial、Helvetica、无衬线字体;
字体大小:12px;
}
.添加btn{
字体大小:11px;
}
输入[type=“text”]{
宽度:100%;
框大小:边框框;
-webkit框大小:边框框;
-moz框大小:边框框;
/*背景色:红色*/
}
1.没有填料{
填充:0.25rem;
}
.没有输入{
保证金:0;
填充:0.4rem;
}

笨蛋
笨蛋
笨蛋
笨蛋
dummy1添加
笨蛋
dummy1添加
dummy1添加
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋

因此,您希望在滚动表格时标题保持在原位

为什么不为您的桌子的
t主体
设置一个固定的
max height
,并添加
overflow-y:auto

下面是一个例子:

//忽略这一点,这只是为了在表中填充虚拟数据,以便进行示例
$(文档).ready(()=>{
const dummy_data=new Array(10).fill(null).map(e=>`dummydummydummydummydummydummydummydummydummydummydummydummydummydummydummy`);
$(“#时钟表tbody”).append(虚拟#u数据)
})
tr>th{
文本对齐:居中;
字号:600;
字体系列:Arial、Helvetica、无衬线字体;
字体大小:12px;
}
tr>td{
字体系列:Arial、Helvetica、无衬线字体;
字体大小:12px;
}
.添加btn{
字体大小:11px;
}
输入[type=“text”]{
宽度:100%;
框大小:边框框;
-webkit框大小:边框框;
-moz框大小:边框框;
/*背景色:红色*/
}
/*表css*/
桌体{
显示:块;
高度:100px;
溢出:覆盖;
}
表tbody tr{
宽度:100%;
}
thead,tbody tr{
显示:表格;
表布局:固定;
}

笨蛋
笨蛋
笨蛋
笨蛋
dummy1添加
笨蛋
dummy1添加
dummy1添加
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋
笨蛋

Google/Yahoo/Bing/DuckDuckGo/…->“ie11 sticky header site:stackoverflow.com”IE不支持sticky,你必须在IE中使用javascript解决方案来解决这个问题。你想要有一个垂直或水平的固定标题位置吗?据我所知,没有一个简单的HTML+CSS解决方案可以在没有固定列宽的情况下适用于ie11。(
position:fixed
解决方案将使用固定列宽)。因此,您需要从前面的
位置找到解决方案:sticky
,或者说它应该是IE11或类似的。有关搜索的详细信息。如果您想要固定标题的垂直位置。只需固定
车身的
最大高度
,这样你的行为就会很棘手。很抱歉回复太晚。我从来没有解决过这个问题,我采取了完全不同的方法。还是谢谢你。