使用jquery / css <table> </table>的列中的缩写文本

Question

我有一个jquery数据表（http://www.datatables.net/），一列有一个较大的文本字段。目前列内容包含在<td>中，但我希望缩写内容，即用户看到“这是非常长的内容......”，没有任何换行。我已经有一个jQuery点击打开了一个jquery ui对话框来显示完整的文本，所以我并不担心那个部分。

我唯一能想到的是在我的控制器中使用Apache StringUtils.abbreviate（String s，int length）方法来获取缩写文本，我可以选择一些适合列大小的长度。我不是很喜欢这个主意。

我想知道是否有一些jQuery插件，或css技巧，或者在浏览器中为我做这件事的东西，以便它适用于任何<td>列宽。

Answer 1

对于纯CSS解决方案，您可以使用text-overflow CSS property。除Firefox之外，主要浏览器（甚至是IE6！）都支持此属性。

此question on SO可能有助于在Firefox中获得相同的效果

Answer 2

试试这个方便的jQuery plugin。

Answer 3

以下是我们在Razor中所做的事情：

   @foreach (var item in Model) {
    <tr data-id="@item.StudyDesignID">
        <td>
            @(item.FieldName.Length > 42 ? item.FieldName.Substring(0, 39) + " ..." : item.FieldName)
        </td>
      </tr>
    }