gpt4 book ai didi

javascript - 一次将 jQuery 可调整大小附加到 2 个表,以便调整同一列的大小

转载 作者:行者123 更新时间:2023-11-28 09:18:34 25 4
gpt4 key购买 nike

如何在特定实例中应用 jQuery,其中有两个表,其中一个表是标题/列表,另一个表包含数据。例如,如果我要调整标题表中的列的大小,那么包含数据的另一个表中的列也会调整大小吗?

这可以完成还是会被视为“超出范围”

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Table Scroll with Fixed Header</title>
</head>
<body>

<table style="width: 300px" cellpadding="0" cellspacing="0" bgcolor="#c0c0c0">
<tr>
<td style="width: 150px">Column 1</td>
<td>Column 2</td>
</tr>
</table>

<div style="overflow: auto;height: 100px; width: 320px;">
<table style="width: 300px;" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 150px">Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
<tr>
<td>Value 1</td>
<td>Value 2</td>
</tr>
</table>
</div>
</body>
</html>

最佳答案

这不是完整的示例,但我希望它能引导您找到解决方案。

您需要将函数绑定(bind)到resize end事件( jQuery API doc ),并且在回调中您可以获取当前项目宽度并将其应用到其他表格列。

$( ".selector" ).bind( "resize", function(event, ui) {
// TODO: you need to check index of the resized column and store it
var width = $(ui).width();
// TODO: find nth column from the other table and set it's width to be exactly same as
// table 1
$(".other-table-selector").width(width);
});

关于javascript - 一次将 jQuery 可调整大小附加到 2 个表,以便调整同一列的大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15301297/

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