gpt4 book ai didi

javascript - 表格行的宽度在我折叠和展开后发生变化

转载 作者:太空宇宙 更新时间:2023-11-04 04:20:30 25 4
gpt4 key购买 nike

我是 Javascript 和 CSS 的新手,我尝试使用 JavaScript 展开/折叠表格行。

而且,我使用 CSS 更改表格的样式。

这是我的代码片段:

<html>
<head>
<script>
function ShowSubTable(titleRow)
{
var nextRow = titleRow.nextSibling;
while (nextRow != null)
{
if( nextRow.tagName != 'TR' ){
nextRow = nextRow.nextSibling;
continue;
}
if (nextRow.style.display == 'none')
{
nextRow.style.display = 'block';
}
else
{
nextRow.style.display = 'none';
}
break;
}
}
</script>
<style>
table.tlb
{
width: 100%;
}
table.tlb th
{
background: #E8C993;
font-size: 22px;
}
table.tlb td
{
background: #FFEAAF;
font-size: 16px;
}
</style>
</head>
<body>
<table class="tlb">
<tr onclick="ShowSubTable(this)">
<th>abc</th>
</tr>
<tr>
<td>123</td>
</tr>
<tr onclick="ShowSubTable(this)">
<th>def</th>
</tr>
<tr>
<td>456</td>
</tr>
</table>
</body>
</html>

展开/折叠功能运行良好。但是有一个问题。

我的表格一开始的宽度是100%。但是,在我折叠表格行并将其展开后。表格行的宽度不是100%。

如何解决这个问题?

提前致谢。

最佳答案

当你显示 tr 元素时,你应该恢复默认显示值

nextRow.style.display = 'table-row';

代替

nextRow.style.display = 'block';

关于javascript - 表格行的宽度在我折叠和展开后发生变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19141848/

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