文本溢出省略号

Question

如果文字太长，我试图在文字末尾添加省略号。

我目前正在使用的CSS是：

style='text-overflow: ellipsis; white-space: nowrap; overflow: hidden;'

我当前的文本应该流过几行，填充div然后有省略号，但是，这个css在第一行的末尾切断文本。如何在div填充文本时才显示省略号？

示例：

这就是我想要的;

"This is an example bit of text
that should go over multiple lines..."

这就是我得到的;

"This is an example bit of text...

感谢。

Answer 1

text-overflow：省略号仅适用于单行文本。解释here .. 我建议玩JS ..就像文章建议的那样。在可以附加省略号的地方，当达到允许的最大字符时。

function shorten(text, maxLength) {
    var ret = text;
    if (ret.length > maxLength) {
        ret = ret.substr(0,maxLength-3) + "...";
    }
    return ret;
}