javascript - 剪切表格中的文字

Question

<table id="tab">
    <tr><td class="sub">mmmmm</td><td class="sub">jjjjj</td></tr>
    <tr><td class="sub">lllll</td><td class="sub">wwwww</td></tr>
</table>

#tab td {
  border: 1px solid green;
  max-width: 40px;
}

$(".sub").each(function(){
    var o = $(this).html();
    $(this).html(o.substring(0, 2))
})

实例:https://jsfiddle.net/UTYLf/1/

我想要 TD 的最大宽度 - 40px。我想剪切溢出文本。我制作了子字符串，但这并不友好。mm != ll 和 jj != ww 等 mm 和 ll 有 2 个字符，但 mm 比 ll 占用更多空间。在我的示例中，我希望表中的表与此示例中的表相同:https://jsfiddle.net/Eb6WN/

我必须使用什么来代替 substr()？我可以使用 HTML、CSS、JavaScript (jQuery) 和 PHP

Answer 1

在这些类型的情况下，我使用 overflow: hidden 并为每个单元格添加一个 title 以显示完整的文本:

#tab td {
    border: 1px solid green;
    max-width: 40px;
    overflow: hidden;
}

$(".sub").each(function(){
    $(this).attr("title", $(this).text()).css("cursor", "help");
})

https://jsfiddle.net/hunter/UTYLf/4/