0

我有一个数据表，我之前已经设置了使用 jquery 的宽度和table-layout: fixedCSS 中的属性。稍后在我的代码中，单元格的内容可能会改变，可能需要改变宽度。结果就像这个小提琴。

如您所见，对于长字符串，单元格内容会从包含它们的单元格中流出并流入下一个单元格。我想做的是在更新单元格后检查单元格的内容，看看内容的宽度是否大于单元格。在我的小提琴中，有一条注释掉的行可以更新宽度：

$('.firstItem').width(202) //successfully fits my entry

问题是它202是硬编码的，我似乎无法弄清楚如何得到它。我尝试了.width(),.outerWidth()和.innerWidth()，td我试图找到内容的宽度，但无济于事。我知道，如果我的内容是 aspan或类似的东西，我可以调用我的宽度方法，但我的大部分内容只是文本，我宁愿不添加更多的 DOM 元素，因为我的表已经很大足以让事情变慢。

有没有一种很好的方法来获取 a 中文本内容的td宽度table？

4

2 回答 2

1

只需在桌子上设置宽度自动：

演示

width: auto;

或使用 textWidth 片段：

演示

$.fn.textWidth = function(text){
  var org = $(this)
  var html = $('<span style="postion:absolute;width:auto;left:-9999px">' + (text || org.html()) + '</span>'); 
  $('body').append(html);
  var width = html.width();
  html.remove();
  return width;
}

$('.firstItem').width($('td.firstItem').textWidth());
于 2013-04-12T21:52:26.563 回答
0

您应该给您的行 anid然后使用它的scrollWidth属性值并更新此 css 规则以使您的 scrollWidth 为 width ：

th, td

th, td{
border: 1px solid black;
width: 203px; /* your scrollWidth value here */
height: 20px;
}
于 2013-04-12T22:07:12.503 回答