jquery – 如何将未知长度的文本修剪为一定数量的行?

前端之家收集整理的这篇文章主要介绍了jquery – 如何将未知长度的文本修剪为一定数量的行?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
鉴于这种:
<p class="summary">Here is some text,could be 5 words,could be 500 words.</p>

我用这段代码抓住段落高度:

var pHeight = $('.summary').height();

在我的情况下,如果它大于32,则它是三行(太长).在这种情况下,我想修剪文本并插入“阅读更多…”链接.问题是,我如何找出修剪的位置以使文本只占用两行?如果只有某种方式我可以采取字数并将它乘以一个数字,即每个字母的大小.对于monospace来说,我认为这是相对简单的,但这是我们所说的Arial.

任何正确方向的点都将不胜感激,谢谢!

解决方法

由于某些原因,这样做没有好办法.首先,不同的浏览器/平台可能会以不同的方式呈现字体(但差异很小).其次,javascript无法提取给定字体(AFAIK)的单个字符大小.

如果我正在实现这样的东西,我只需要一个常量来获得最长的允许长度并将其子串.我也会做这个服务器端,因为没有必要将数据发送到你不会使用的客户端.

另一种方法(虽然不是我使用的方法)是将文本放在具有设置宽度和高度的div中,用overflow:hidden剪切任何溢出.当然,这可能会让你有一些部分切断的话,所以我会反对它.

猜你在找的jQuery相关文章