如何从JavaScript调整表格列的宽度

时间:2009-04-30 15:30:42

标签: javascript css column-width

我的javascript有问题。
我有一个存储在TabList中的表格单元格列表 我想找到最大宽度,然后将这个宽度设置为所有宽度 这里有一个示例代码,但宽度的设置不起作用。

var MaxTabWidth = 0;
for (var i = 0; i < TabList.length-1; i++)
{
  if (TabList[i].offsetWidth>MaxTabWidth) 
    MaxTabWidth = TabList[i].offsetWidth;
}

for (var i = 0; i < TabList.length-1; i++)
{
  TabList[i].style.width = MaxTabWidth+"px";
  // TabList[i].width = MaxTabWidth+"px";
  // TabList[i].offsetWidth = MaxTabWidth+"px";
}

我评论了我的尝试..
有帮助吗?
This 没有为我做的伎俩...

更新
我确定TabList是一个Cells列表,因为我正在检查className。
我循环到TabList.length-1,因为我希望最后一个单元格填充表格宽度的其余部分。

3 个答案:

答案 0 :(得分:4)

我建议您从页面中删除所有css /样式并对其进行测试以隔离问题。像这样的事情通常会被css弄复杂。

答案 1 :(得分:1)

如果将整个表的宽度设置为--i * MaxTabWidth。这会平均分配列吗?假设您的表名为myTable。

document.getElementById('myTable').width = new String(--i*MaxTabWidth)

编辑:也不会

for (var i = 0; i < TabList.length-1; i++)

通过停在TabList.length-2?

跳过最后一列

答案 2 :(得分:0)

对于它的价值,在jQuery中可以使用以下脚本完成,其中表的id为“myTable”。如果您对框架中添加的环境有足够的控制权,我会强烈推荐它,因为它可以使这些任务变得更加容易。

    var maxWidth = 0;

    $("#myTable td").each(function() {
        if ($(this).width() > maxWidth) {
            maxWidth = $(this).width();
        }
    });
    $("#myTable td").width(maxWidth);