克隆一个 tr，但保留宽度答案

【问题标题】：Clone a tr, but preserve width克隆一个 tr，但保留宽度
【发布时间】：2011-09-26 05:43:22
【问题描述】：

我正在尝试克隆表中的一行，并将该行插入到一个空表中。很简单。

但是是否可以保留 tr 中单元格的原始宽度（可能由于同一列中的其他单元格而扩大）？

编辑刚刚意识到我应该在克隆后遍历匹配的单元格并同步宽度。不过还是很好奇有没有更直接的方法……

【问题讨论】：

等等。 . .你想让同一列中的单元格不共享相同的宽度吗？这似乎很奇怪。
@Levi Morrison 我真的有那么不清楚吗？我失败了。我不想更改要从中复制行的表的任何内容。我想复制该行，只将该行插入到一个单独的表中（除了我复制的那一行之外，它永远不会包含任何其他行），宽度与以前相同。
啊，您希望表格的宽度（以及表格中的每一列）相同，而不管内容如何？
@chrislegend ，你能提供一些代码
为什么不制定样式表，使“原始”表和“目标”表的样式相同？（通过类或元素层次结构）

标签： jquery html html-table width clone

【解决方案1】：

克隆您的行，然后遍历该行的子级，将每个子级的宽度设置为相应索引处原始的每个子级。

var target = $('#target');
var target_children = target.children();

var clone = target.clone();

clone.children().width(function(i,val) {
    return target_children.eq(i).width();
});

$('<table>',{border:1}).append(clone).appendTo('body');

示例： http://jsfiddle.net/z7hWh/

我不确定浏览器是否支持在 <td> 上设置宽度。

【讨论】：

...如果他们调整浏览器的大小并且一个表使用 % 而另一个现在设置了怎么办？哦哦。 . .
@Levi：我们是否增加了要求？ “保留单元格的原始宽度”它没有说明将未来的更改同步到宽度。
很好的解决方案。谢谢。可以假设表格宽度不会改变。

【解决方案2】：

指定严格的 CSS 规则。

可能的答案：

将它们定义为每个单元格的宽度相同（可能不是您想要的）。
使用colgroups（推荐）。
不要为 td 定义样式，而是在表头 th 上定义它们。如果您的表格没有标题，显然是行不通的。

【讨论】：

好主意，但我不想过多地接触 css 或表格结构（可能会破坏他们正在做的其他事情），尽管这肯定是要走的路
@chrislegend，嗯，很好。但这就是 CSS 的用途。 . .大声笑
当然。我正在为一些相当庞大的网络应用程序添加功能......所以我真的不得不“超越”事情而不是做出重大改变。