内容加载后强制表列固定

Question

我有一个HTML表格，我在其中进行排序和过滤，当我进行过滤时，我的列宽度会有所不同。我想知道是否有办法强制表在内容加载到我的表后保持其宽度。因此，当我进行过滤或排序时，没有任何东西可以移动，它只会保持每列的宽度。

我需要在数据加载到表格后保持静态宽度，因为我不总是加载相同的数据。我首先希望数据很好地调整到表中，然后在排序或过滤后永远不要让它改变宽度。

感谢。

Answer 1

我希望我能正确理解你的问题。只要数据加载，您就可以将单元格width保留在auto上，以便您的表格调整您想要的方式。然后，当过滤数据时，读取px

中列的实际宽度

var firstColumnWidth = $("td:nth-child(1)").get(0).clientWidth;

并将width设置为该固定值

$("td:nth-child(1)").each(function(i){$(this).css("width",firstColumnWidth+"px");});

示例：http://jsfiddle.net/3vqja4sa/

Answer 2

为您的表添加样式，这将解决您的问题

#table-id{
 position:fixed;
 display:block;
}

或

  #table-id{
  position:fixed;
  display:inline-block;
  }

Answer 3

您可以为每列提供最小或最大宽度。

.custom-max
{
max-width: value; 
}

OR

.custom-min
{
min-width: value;
}