Javascript 太长时动态缩短/隐藏/重叠表格单元格中的tekst

我的表格具有静态宽度值，但有时某列的表格单元格可能包含太长的文本，这会弄乱表格的宽度。我正在寻找一种动态缩短文本的方法（有点像表格网格功能，但没有网格），因为它可以是可变长度的，当鼠标悬停在表格单元格上时，整个文本都会显示出来，而不会拉伸表格

目前，我在我的脚本中以以下方式硬编码：

string.substring（0,65）+'…'

并将全文传递给表格单元格的“title”属性

请注意，我不想继续使用“title”属性。当由悬停事件触发时，我尝试用

包围文本，但不幸的是，这不是一个吸引人的解决方案，因为文本在填充或边距样式更改时稍微向底部移动

---

解决方案也可以是jQuery插件或JavaScript脚本。

1。缩短原始数据

我建议你认为在第六十五个字上切弦比弦更优雅。相反，寻找空格来打断字符串。只有在找不到空白的情况下才将中间单词切掉

要在表格单元格中节省更多空间，请使用省略号字符…而不是三个句点。。。从这个答案上复制/粘贴即可。省略号字符也可以使用不同或更小的字体进行样式设置

2。在悬停时显示原始数据

---

我更喜欢你。他们的小部件在这方面工作得很好。您应该尝试以下CSS指令：

td { break-word: word-wrap; }

这适用于许多浏览器（是的，包括IE6，甚至包括IE5.5，但不是Fx3.0。它只被Fx3.5+识别。对Saf、Chr和Op也有好处，但我不知道这些浏览器的确切版本），并且不会对其他浏览器造成任何伤害

如果表的宽度仍然混乱，则还有：

table { table-layout: fixed; }
th, td { width: some_value; }

---

这将迫使浏览器使用另一种表算法，在这种算法中，它不会尝试适应许多情况，包括尴尬的情况，而是坚持样式表所说的内容。

工具提示是我的第一个想法，但我不想为了这件小事在文件中添加一堆额外的JavaScript代码，因为我想保持尽可能小的文件大小。至于做空，我想要一个重叠的解决方案。我发现用

包围文本部分解决了问题，但我希望避免滚动。相反，文本的其余部分应该在悬停时显示，就像工具提示一样。