javascript - 动态表格宽度

Question

我有一个表格单元格，其中显示了其他表格(具有背景色)。内表并不总是显示；它们可以通过按钮隐藏(使用 jQuery 更改类)。现在我希望外部单元格始终充满颜色。这意味着如果只显示一个表格，其宽度应为 100%。当显示两个时，每个宽度应为 50%，以此类推。 我该如何解决这个问题？

这是一个例子:

... 
<td>
<table class="show"><tr><td></td></tr></table>
<table class=""><tr><td></td></tr></table>
<table class="show"><tr><td></td></tr></table>
</td>
...

在这种情况下，宽度应为 50%

Answer 1

您可以使用 Jquery 更改宽度值。

var count_table = $(".show").length;         // count ".show" elements

$(".show").each(function{                    // iteration on each ".show"
    var width = 100/count_table;             // % value of new width
    $(this).css("width", width+"%");         // CSS modification
});

此代码仅适用于一个 TD 元素。您还需要迭代每个“td”。

(希望我回答了你的问题)